About ColorPeek
A free, open collection of color and CSS design tools built for web designers and developers.
Instant Load
No splash screens, no loading states
No Accounts
Zero sign-ups, zero paywalls
Client-Side
All math runs in your browser
Free Forever
Personal and commercial use
What is ColorPeek?
ColorPeek is a free browser-based toolkit for designers and developers who work with color and CSS. It brings together 23+ tools in one place - from color palette generators and CSS shadow builders to contrast checkers, type scale calculators, and font pairing previews.
Every tool runs entirely in your browser. There are no accounts, no sign-ups, no paywalls, and no data collected from what you create. Your palettes, gradients, and CSS code stay on your machine.
The site is free to use for personal and commercial projects. No attribution required.
Why I Built This
"I kept switching between a dozen different websites. Each site had one tool, required sign-up for exports, or was cluttered with ads. It was frustrating."
Hi - I'm Abhijit Chapke, a developer based in India. I started building the tools I actually needed - a gradient generator that copies clean CSS, a tint/shade generator that outputs Tailwind-compatible scales, a font pairing tool that loads Google Fonts live. One by one, ColorPeek grew into a full toolkit.
The philosophy is simple: design tools should load instantly, work without accounts, and never get in the way. If a tool doesn't solve a real problem faster than opening a code editor, it doesn't belong here.
What You Can Do
Color Tools
Explore tools →Generate palettes, create tint/shade scales, convert between HEX/RGB/HSL/OKLCH/CMYK, extract palettes from images or URLs, simulate color blindness (7 types), blend colors, generate harmonies, find color names, and export as CSS variables, SCSS, Tailwind, JSON, or SVG.
CSS Generators
Explore tools →Build CSS gradients (linear, radial, conic) visually. Generate multi-layer box shadows, glassmorphism panels, border-radius shapes, text shadows, CSS filters, flexbox layouts, and CSS grid layouts — all with live preview and copy-ready code.
Typography
Explore tools →Calculate modular type scales with 8 musical ratios (Minor Third through Golden Ratio), preview Google Font pairings with live text samples, and generate design system spacing scales — export to CSS, SCSS, Tailwind, or JSON.
Accessibility
Explore tools →Check WCAG 2.1 color contrast ratios with AA and AAA pass/fail badges, live text preview, and automatic suggestion of a passing alternative color.
How It's Built
ColorPeek is hosted on Netlify with static prerendering so every page loads with real HTML and metadata — no JavaScript required to see the content. All color math (OKLCH conversions, WCAG contrast formulas, tint/shade generation) is implemented directly in the browser with no external color API or server calls.
Get in Touch
Bug reports, feature requests, and feedback are all welcome. If a tool is behaving unexpectedly, or if you have an idea for something genuinely useful, I'd like to hear about it.
Send a message