Chromoforge
Color tools
Start with a color or an image. Generate shades, check a specific contrast pair, then export colors for your project.
Use a tool
PaletteStart with a color or an image. Generate shades, check a specific contrast pair, then export colors for your project.Image Color ExtractorExtract a dominant color palette from PNG, JPG or WebP images. Processed locally in your browser — nothing uploaded.Color Shades GeneratorGenerate a 50-950 shade scale from one base color for Tailwind-style UI surfaces, borders, hover states and dark mode.WCAG Contrast CheckerCheck whether text and background colors meet WCAG AA and AAA contrast ratios. Free, instant, no upload required.Color converter: HEX, RGB, HSL and OKLCHConvert HEX, RGB, HSL or OKLCH to HEX, RGB, HSL and OKLCH immediately. Copy each format or a CSS variable. Free, local and no account required.CSS color variables generatorGenerate CSS variables from one color: brand, readable foreground and an eleven-step 50–950 shade scale. Copy or download the CSS directly.shadcn/ui theme generatorCreate a shadcn/ui theme from primary, secondary and neutral colors. Preview light/dark and copy OKLCH tokens with a Tailwind v4 @theme inline mapping.Tailwind color palette generatorGenerate three Tailwind color scales from 50 to 950. Preview components and export Tailwind v4 @theme, v3 configuration, CSS variables or JSON.Chart color palette generatorGenerate chart palettes with categorical, sequential and diverging modes. Set the background, inspect contrast and export JavaScript, JSON or CSS.
Practical guides
Accessible Color Palette GeneratorGenerate a palette in the main tool and check the text/background pairs you intend to use.Brand Color Palette GeneratorBuild a brand color palette from one logo or primary color, then export UI-ready CSS variables and design tokens.Color Blindness SimulatorPreview palettes for deuteranopia, protanopia and tritanopia to catch risky color combinations before shipping.Color Harmony GeneratorGenerate complementary, analogous, triadic, split-complementary, tetradic and monochromatic color harmonies.Color Palette GeneratorGenerate harmonious color palettes from one base color using complementary, analogous, triadic and monochromatic harmony rules.Color Theory GuideA practical guide to color harmony, WCAG contrast and UI palette usage. Complementary, analogous, triadic rules explained with real design examples.Dark Mode Color Palette GeneratorCreate dark mode palettes with readable foregrounds, muted surfaces, borders and accessible accent colors.Design Tokens GeneratorCreate color design tokens from a palette and export CSS variables, SCSS maps, JSON and Tailwind-ready values.CSS Gradient GeneratorCreate linear, radial and conic CSS gradients from generated color palettes. Preview live and copy the CSS in one click.Website Color Scheme GeneratorCreate a website color scheme with primary, neutral and accent colors for hero sections, buttons, cards and forms.