Surface, border and readable text.
COLOR PICKER
Pick your main color.
100%
Alpha HEX: FF
8-digit HEX: #B11226FF
RGB
177, 18, 38
HSL
352°, 82%, 38%
WEBSITE SCHEME
Build around this color.
Primary
Hover
Accent
Background
Surface
Text
Muted Text
Border
BRAND
Home About Contact
BUILD SOMETHING
Your website, already color-matched.
ColorStack generates a practical UI scheme around the color you choose.
Generated from your main color.
Happy with the way it looks? Copy CSS for your site:
ACCESSIBILITY
Contrast check.
ColorStack checks the text and background combinations used in your generated website scheme.
Main Text / BackgroundNormal text
—
—
Muted Text / BackgroundNormal text
—
—
Main Text / SurfaceNormal text
—
—
Muted Text / SurfaceNormal text
—
—
Button Text / PrimaryNormal text
—
—
What does AA / AAA mean?
AA is the common accessibility target for normal website text and requires a contrast ratio of at least 4.5:1. AAA is stricter and requires at least 7:1. Higher contrast generally makes text easier to read.