Let's UI

State Calculator

Theme

Pick a resting colour and the content colour drawn on it. Hover and pressed are that content colour mixed into the resting one — see what they resolve to and whether they stay legible.

Live sample

Show state
  

States

Aa

rest

Aa

hover

Aa

pressed

Mix scale

Drag along the scale to see any amount of tint, and where the state layer sits on it.

hover pressed