colors.codes

colors.codes — the definitive color library for the web, as a side panel workspace. A complete color toolkit that lives next to the page you're working on. Open it from the toolbar (or Alt+Shift+C / ⌥+Shift+C) and the side panel rides along as you browse — picking, organizing, and exporting colors without breaking your flow. What's inside 1) EyeDropper — pixel-accurate color picking from anywhere on the page (or any visible window via Chrome's native picker). 2) Inspector — see every color the active page actually uses: extracted from CSS, gradients, design- system tokens (including adoptedStyleSheets), and dominant image colors. 3) Palette builder — collect colors into named palettes. Drag to reorder, edit on the fly, autosave to local storage. 4) Image — drop or paste an image, sample its dominant colors, build a palette from a photo or screenshot. 5) Harmony — generate complementary, analogous, triadic, and split-complementary schemes from any base color. 6) Contrast — WCAG AA/AAA contrast checker with live preview and pass/fail per text size. 7) Tailwind export — turn any palette into a @theme block (Tailwind v4) or tailwind.config extension (v3) with auto-generated semantic names. Includes an alpha-stops mode for opacity scales. 8) Gradient — visual gradient builder with live OKLCH/HSL/RGB interpolation. Color creator — full HSL / OKLCH / hex editor with format conversion. 9) History & favorites — every color you pick is saved locally; star the ones you love. 10) Curated library — hundreds of named colors organized by mood, family, and tag, browsable inside the panel. Built for designers and developers a) Works on any site — no account required. b) Everything stays on your device. No analytics, no tracking, no servers. c) Light and dark themes; respects prefers-reduced-motion. d) Keyboard-first: Alt+Shift+C / ⌥+Shift+C opens the panel; ? shows shortcuts. What's new in 1.0.0 Complete rebuild from the ground up as a side-panel workspace (the previous popup release stays available for users who prefer that flow). New tools: Tailwind export, Harmony, Gradient builder, Image color extraction, Color creator. Refreshed dark UI, OKLCH-native color pipeline, IndexedDB-backed persistence for palettes and history. Privacy No data ever leaves your browser. No accounts, no analytics, no third-party scripts. The extension uses local storage (IndexedDB) for your palettes, history, and favorites — and that's it. Visit colors.codes for the web library and color games.