About ColourKit Pro

ColourKit Pro 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 Pro 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.

Your Data

All your saved palettes and preferences are stored locally in your browser. Use the controls below to export a backup, restore from a previous backup, or clear all stored data.

Backup & RestoreImport Backup