A designer drops a hex code into a Slack message. A developer needs the RGB equivalent for a CSS variable. Someone else just wants to know if their white text will actually be readable on that new brand-blue background. Color Toolkit exists for exactly these moments — the small, constant color math that eats up more time than it should.
At its core is a live converter: type a value in HEX, RGB, HSL, or CMYK, and the other three update instantly, no extra tap required. Paste a raw "rgb(...)" or "hsl(...)" string straight from a stylesheet and it gets parsed automatically. Out-of-range values get clamped and flagged rather than throwing an error, so nothing ever gets stuck or crashes mid-edit.
Beyond conversion, the Shade Generator takes any base color and builds a full 10-step tint-and-shade ramp in one tap, perfect for building out a consistent UI palette from a single brand color. The Contrast Checker runs the same math accessibility auditors use, returning an exact ratio plus clear pass/fail badges across AA and AAA, normal and large text — so contrast decisions stop being guesswork.
Everything worth keeping can be saved to a personal palette, timestamped and reorderable, ready to revisit across projects.
What's inside:
- Live four-way color conversion (HEX, RGB, HSL, CMYK)
- Auto-parsing of pasted CSS color strings
- 10-step shade/tint ramp generator
- WCAG contrast ratio checker with AA/AAA badges
- Personal saved-palette history with timestamps
- Built-in guide explaining the color math behind every screen
Color Toolkit turns the ten-minute color-math detour into a ten-second one.
Convert colors, generate shades, and check contrast instantly.