UltraKit · Widget #11
12 Platforms × 8 Layout Styles × 6 Icon Shapes × Tooltip Styles × Color Modes
8 Color Mode7 Button Layout6 Icon Shape5 Tooltip Style6 More Choices3 Toggles
Section 01
8 options for color mode — all shown live below.
1
Mode 1: Official Brand Colorscolor_mode = brand
2
Mode 2: Single Custom Colorcolor_mode = custom
3
Mode 3: Gradient (custom)color_mode = gradient
4
Mode 4: Outline / Ghostcolor_mode = outline
5
Mode 5: Unified Darkcolor_mode = dark
6
Mode 6: Unified Lightcolor_mode = light
7
Mode 7: Monochrome Blackcolor_mode = mono
8
Mode 8: Glassmorphismcolor_mode = glass
Section 02
7 options for button layout — all shown live below.
1
Layout 1: Icon Onlybutton_layout = layout-1
2
Layout 2: Icon + Label Inlinebutton_layout = layout-2
3
Layout 3: Label Onlybutton_layout = layout-3
4
Layout 4: Icon Stacked + Label Belowbutton_layout = layout-4
5
Layout 6: Icon + Countbutton_layout = layout-6
6
Layout 7: Minimal Dots Rowbutton_layout = layout-7
7
Layout 8: Wide Fill Barbutton_layout = layout-8
Section 03
6 options for icon shape — all shown live below.
1
Shape 1: Circleicon_shape = shape-circle
2
Shape 2: Squareicon_shape = shape-square
3
Shape 3: Rounded Squareicon_shape = shape-rounded
4
Shape 4: Hexagonicon_shape = shape-hexagon
5
Shape 5: Pill (wide)icon_shape = shape-pill
6
Shape 6: No Shape (Bare)icon_shape = shape-none
Section 04
5 options for tooltip style — all shown live below.
1
Style 1: Darktooltip_style = tt-dark
2
Style 2: Lighttooltip_style = tt-light
3
Style 3: Brand Colortooltip_style = tt-brand
4
Style 4: Glasstooltip_style = tt-glass
5
Style 5: Minimal Bordertooltip_style = tt-minimal
Section 05
Extra switches for the finishing touches.
1
Share URL: Current Page URLshare_url_type = current
2
Share URL: Custom URLshare_url_type = custom
3
Share Title: Current Page Titleshare_title_type = current
4
Share Title: Custom Titleshare_title_type = custom
5
Tooltip Position: Toptooltip_position = top
6
Tooltip Position: Bottomtooltip_position = bottom
Section 06
Switch parts of the widget on or off.
1
Open in Popup Window — Offopen_in_popup = off
2
Show Tooltip on Hover — Offshow_tooltip = off
3
Hide On Desktop — Onhide_desktop = hidden-desktop