About ColourKit
ColourKit is a free, browser-based suite of colour tools built for designers, developers, illustrators and anyone who works with colour. Every tool runs entirely in your browser — your data never leaves your device.
Our Tools
- ●Generate — Generate random colour palettes with harmony modes
- ●From Image — Extract a colour palette from any image
- ●Contrast Checker — Check WCAG contrast ratios between two colours
- ●Gradient Maker — Create beautiful CSS gradients with multiple colour stops
- ●Shades — Generate tints and shades of any colour
Our Principles
- 1.Always free — no signup, no paywall, no limits.
- 2.Privacy first — all processing happens in your browser. Images are never uploaded to a server.
- 3.Standards-based — contrast ratios follow WCAG 2.1 guidelines. Colour conversions use established formulas.
- 4.Works everywhere — phone, tablet, desktop. No app to install, no dependencies.
Keyboard Shortcuts
| Shortcut | Action | Page |
|---|---|---|
| Space | Regenerate palette | Home |
| Click swatch | Copy hex value to clipboard | All tools |
| Esc | Close mobile menu | All pages |
Supported Features
✓6 colour harmony modes (random, analogous, complementary, triadic, split-complementary, monochromatic)
✓Palette locking — keep colours you like, regenerate the rest
✓Export as CSS custom properties, Tailwind config, SCSS variables or JSON
✓WCAG AA and AAA contrast ratio checking for normal and large text
✓Image colour extraction using k-means clustering (4-8 colours)
✓CSS gradient maker with up to 8 stops (linear and radial)
✓Tint and shade generation (1-30 steps) for any hex colour
✓PNG swatch download for gradients
✓Full privacy — all processing runs in-browser, nothing is uploaded
✓Responsive design — works on mobile, tablet and desktop
Technical Details
ColourKit is built with Next.js, TypeScript and Tailwind CSS. It uses no external colour libraries — all colour maths (hex/RGB/HSL conversions, WCAG luminance calculations, k-means clustering) is implemented from scratch using the Web Platform APIs.
The site is statically exported and served from Cloudflare Pages for fast, global delivery. The entire application weighs under 100KB (gzipped) and scores 100 on Lighthouse Performance.