Color Pickers
Colour picker
Best for
The picker a design tool opens — paint type, stops, spectrum and the hex in one card
Anatomy
Paint-type row · Stops bar · saturation spectrum · sampler with hue and opacity · Hex / RGB / CSS field · Recently Used with its contrast readout
Stops
Recently Used
AA5.4:1 on whiteFancy picker
Best for
The same picker as a panel — tabs for your own colours and the shared libraries, every corner pilled
Anatomy
Custom / Libraries tabs with copy and close · spectrum first · Stops · sampler · Hex / RGB / CSS field · Recently Used with its contrast readout
Stops
Recently Used
AA5.4:1 on whiteGradient builder
Best for
Building a gradient you can paste — stops, positions, angle and the CSS
Anatomy
Live preview · angle slider · a row per stop with its swatch, position and remove · Add Stop · the CSS field with copy
Gradient
Add stops, drag positions, recolor each. Copy the CSS when you’re done.
background: linear-gradient(145deg, #0B1F6B 0%, #3E6BFF 45%, #FF9AC4 100%);
Choose colour
Best for
A compact colour field — hue, opacity, a hex you can type and the colours you used last
Anatomy
Title with the live hex · hue and opacity tracks · pill field with swatch and opacity menu · clear · Recently Used ramp
Choose color
#005CF8
Recently Used
Change colour
Best for
Recolouring a list in place — a palette where each dot opens its own hue slider
Anatomy
Column of colour dots · the picked one ringed · tooltip with a tail holding the swatch and its hue track
Be first in,
and 10% off.
Join the list and we’ll email you the moment the code library and MCP server go live — with a 10% discount code to use whenever you decide to buy.
One email when it ships. No spam, and you can unsubscribe anytime.Color Pickers
Colour picker
Best for
The picker a design tool opens — paint type, stops, spectrum and the hex in one card
Anatomy
Paint-type row · Stops bar · saturation spectrum · sampler with hue and opacity · Hex / RGB / CSS field · Recently Used with its contrast readout
Stops
Recently Used
AA5.4:1 on whiteFancy picker
Best for
The same picker as a panel — tabs for your own colours and the shared libraries, every corner pilled
Anatomy
Custom / Libraries tabs with copy and close · spectrum first · Stops · sampler · Hex / RGB / CSS field · Recently Used with its contrast readout
Stops
Recently Used
AA5.4:1 on whiteGradient builder
Best for
Building a gradient you can paste — stops, positions, angle and the CSS
Anatomy
Live preview · angle slider · a row per stop with its swatch, position and remove · Add Stop · the CSS field with copy
Gradient
Add stops, drag positions, recolor each. Copy the CSS when you’re done.
background: linear-gradient(145deg, #0B1F6B 0%, #3E6BFF 45%, #FF9AC4 100%);
Choose colour
Best for
A compact colour field — hue, opacity, a hex you can type and the colours you used last
Anatomy
Title with the live hex · hue and opacity tracks · pill field with swatch and opacity menu · clear · Recently Used ramp
Choose color
#005CF8
Recently Used
Change colour
Best for
Recolouring a list in place — a palette where each dot opens its own hue slider
Anatomy
Column of colour dots · the picked one ringed · tooltip with a tail holding the swatch and its hue track
Be first in, and 10% off.
Join the list and we’ll email you the moment the code library and MCP server go live — with a 10% discount code to use whenever you decide to buy.
One email when it ships. No spam, and you can unsubscribe anytime.