Light / Dark Toggle
Hero Extra Large

Bright wizard juggles quirky UX tasks for maximum fun

Hero Large

Bright wizard juggles quirky UX tasks for maximum fun

Hero Medium

Bright wizard juggles quirky UX tasks for maximum fun

Hero Small

Bright wizard juggles quirky UX tasks for maximum fun

Display Large

Bright wizard juggles quirky UX tasks for maximum fun

Display Medium

Bright wizard juggles quirky UX tasks for maximum fun

Display Small

Bright wizard juggles quirky UX tasks for maximum fun

Headline Large

Bright wizard juggles quirky UX tasks for maximum fun

Headline Medium

Bright wizard juggles quirky UX tasks for maximum fun

Headline Small

Bright wizard juggles quirky UX tasks for maximum fun

Title Large

Bright wizard juggles quirky UX tasks for maximum fun

Title Medium
Bright wizard juggles quirky UX tasks for maximum fun
Title Small
Bright wizard juggles quirky UX tasks for maximum fun
Label Large
Label L
Label Medium
Label M
Label Small
Label S
Label Extra Small
Label XS
Label Extra Extra Small
Label XXS
Body Extra Large

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Body Large

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Body Medium

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Body Small

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Drawer
Elevated

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Filled

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Outlined

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Elevated

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Filled

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Outlined

I craft pixel-perfect interfaces, seamless user experiences, and clever design solutions. From wireframes to hi-fi prototypes, I turn ideas into interactive journeys.

Skilled in UX strategy, UI design, front-end finesse, and design systems that actually scale. Passionate about making complex flows feel effortless, and always pushing the boundary where creativity meets code.

Icon Sizes
filter_list
filter_list
filter_list
filter_list
Splide Arrows
Buttons (Extra Small)
Buttons (Small)
Buttons (Medium)
Icon Buttons (Large)
Icon Buttons (Extra Large)
Icon Buttons (Extra Small)
Icon Buttons (Small)
Icon Buttons (Medium)
Icon Buttons (Large)
Icon Buttons (Extra Large)
Dropdowns
Dropdown left
arrow_drop_down
arrow_drop_up
Dropdown right
arrow_drop_down
arrow_drop_up
Radio Buttons
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Chips
States
Chips (Compact)
Chips (Large)
Chip States
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Spacing 0
Spacing 1
Spacing 2
Spacing 3
Spacing 4
Spacing 5
Spacing 6
Spacing 7
Spacing 8
Spacing 9
Spacing 10
Spacing 11
Spacing 12
Spacing 13
Spacing 14
Spacing 15
Spacing 16
Elevation 0
Elevation 1
Elevation 2
Elevation 3
Elevation 4
Elevation 5
Sample

Heading 1

Heading 2

Heading 3

Title Large

Title Medium
Title Small

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

“Block quote 1”
“Block quote 2”

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Timing Curves
Curve Name CSS cubic-bezier Use Case
Standard cubic-bezier(0.2, 0, 0, 1) Default motion (fade, zoom, etc.)
Decelerate cubic-bezier(0, 0, 0, 1) Entering elements (fade/zoom in)
Accelerate cubic-bezier(0.3, 0, 1, 1) Exiting elements (fade/zoom out)
Emphasized (in) cubic-bezier(0.05, 0.7, 0.1, 1) Emphasized entrance (e.g. lightbox open)
Emphasized (out) cubic-bezier(0.3, 0, 0.8, 0.15) Emphasized exit (e.g. lightbox close)
Fade and Zoom
Motion Type Duration Curve Example Use
Fade in 200ms Decelerate Dialog, tooltip appearing
Fade out 150ms Accelerate Dismissing element
Zoom in (scale) 200–300ms Emphasized (in) or Decelerate Cards, modals, lightboxes
Zoom out (scale) 150–200ms Emphasized (out) or Accelerate Exit transitions