Category · 4 tools
Color & Design tools
Design utilities that speak CSS. Translate between color notations, build a harmonious palette from a single seed, and compose gradients and shadows with a live preview and copyable declarations.
Color Palette Generator
Generate complementary, analogous, triadic and other colour schemes from a single seed colour.
CSS Box Shadow Generator
Layer multiple CSS box-shadows with adjustable offset, blur, spread, colour and inset.
CSS Gradient Generator
Build linear, radial and conic CSS gradients with multiple colour stops and a live preview.
HEX / RGB / HSL Converter
Convert between hex, RGB, HSL and CSS named colours, with contrast ratios against black and white.
Questions about color & design tools
Are the color & design tools free to use?
Yes. All 4 tools in this category are free, need no account and have no usage limits. ToolzKit is funded by keeping the site cheap to run, not by gating features.
Does my data get uploaded anywhere?
Every tool in this category runs its processing in your browser using ordinary JavaScript. Your input is not sent to a server, and it is not written to storage when you leave the page.
Can I use these tools on a phone?
Yes. The layouts adapt to narrow screens, editors stack vertically instead of side by side, and copy buttons stay reachable without horizontal scrolling.
How do I find a tool quickly?
Press the forward slash key, or Ctrl+K on Windows and Cmd+K on macOS, to open the command palette from any page. Type a few letters and press Enter.
Related categories
- DeveloperFormat, validate and inspect code and data
- GeneratorsProduce identifiers, placeholders and codes
- ProductivityEveryday desk utilities
Or see every tool across all 12 categories.