Color reference, tools & data

Colors Encyclopedia

Explore named colors, HEX values, palettes, harmonies, brand colors, and accessibility data — then create gradients, generate color systems, compare colors, and export production-ready CSS.

A connected color platform for designers and developers, combining an independent encyclopedia, professional tools, WCAG guidance, downloadable references, and machine-readable data.

Explore named colors Open color tools

Sky#8ED6FF Peach#FFB38A Lime#B7E46C Lilac#B8A5FF Butter#FFD86B Periwinkle#8FA8FF Mint#8EE3C2 Pink#FF8FBE Aqua#7FE1E8

Explore Colors Encyclopedia

Everything you can do with color

Choose a starting point, try a real example, and continue into the complete section when you find the workflow you need.

Discover

Color Explorer

Open Explorer

Filter the editorial catalog by the visual and technical qualities that matter to your project.

FamilyBlue familyExplore →TonePastel colorsExplore →TemperatureWarm colorsExplore →AccessibilityAAA optionsExplore →

Encyclopedia

Named Colors

All named colors

Start with a familiar name, then open conversions, accessibility, CSS, palettes, and connected tools.

Sage Green#9CAF88Avocado#568203Midnight Blue#191970Coral#FF7F50

Browse

Color Families

All families

Move through recognizable families, tones, and temperatures before choosing an individual color.

RedView family BlueView family GreenView family NeutralView tone

Inspect

HEX Atlas

Open HEX Atlas

Enter or select a HEX value to inspect RGB, HSL, CMYK, luminance, contrast, and nearest names.

#9CAF88RGB 156, 175, 136 #568203RGB 86, 130, 3 #191970RGB 25, 25, 112 #FF7F50RGB 255, 127, 80

Combine

Color Harmonies

All harmonies

Explore complementary, analogous, triadic, tetradic, split, and monochromatic relationships.

Sage GreenOpen harmonies Midnight BlueOpen harmonies CoralOpen harmonies AvocadoOpen harmonies

Create

Color Palettes

All palettes

Open curated and generated systems with reusable roles, CSS variables, and accessibility guidance.

Sage Green PaletteOpen palette Warm Neutral ColorsOpen palette Navy Blue PaletteOpen palette

Analyze

Compare Colors

Compare colors

Put two colors side by side and understand the differences in values, contrast, meaning, and use.

Sage Green vs Olive GreenNavy Blue vs Midnight BlueCream vs IvoryTeal vs Turquoise

Reference

Brand Colors

All brand colors

Browse independent technical references for commonly cited palettes without implying affiliation or ownership.

Google4 colorsApple4 colorsMicrosoft4 colorsMeta4 colors

Colors Encyclopedia Tools

Professional color tools for everyday design and CSS

Move from reference to production: create visual effects, generate design tokens, verify accessibility, and copy implementation-ready code.

15interactive toolsFree · No sign-up

Start with a colorOpen a tool with your HEX value already applied.

CreateCSS Gradient StudioBuild linear, radial, and conic gradients with editable stops and copy-ready CSS.Open tool ExportPalette & Token StudioGenerate a 50–950 color scale and export CSS, SCSS, JSON, or Tailwind tokens.Open tool AccessibilityColor Contrast CheckerCheck WCAG AA and AAA thresholds for text, large text, and interface components.Open tool DevelopCSS Color MixerMix two colors visually and copy color-mix() with a practical HEX fallback.Open tool

Explore the complete color platformCreation, development, accessibility, conversion, and structured color data in one focused workspace.

Explore all color tools

Dataset & API Hub

Dataset v1.0.0 publishes stable static resources for crawling, integration, audit, and AI ingestion.

Dataset v1.0.0Version, scope, licensing notes, ingestion guidance, and generated dataset resources. API IndexStatic JSON endpoint directory for colors, HEX, palettes, comparisons, brands, tools, and WCAG. ManifestBuild hash, route totals, module configuration, guardrails, and dataset version. ChangelogVersion history and expansion notes for the dataset. AuditPublic route, sitemap, and API coverage summary. AI Ingestion GuidancePay Per Crawl readiness, crawler expectations, and automated access policy.

Trust & Editorial

Colors Encyclopedia separates generated color math from editorial judgment and publishes the policies needed to evaluate the site seriously.

AboutIndependent color reference, HEX atlas, palette system, and AI-ready static dataset. MethodologyColor conversions, HEX atlas generation, harmonies, variants, palettes, and brand references. How We Verify ColorsHEX normalization, WCAG validation, color family classification, route manifests, and API consistency checks. Editorial PolicyStandards for naming, descriptions, brand references, accessibility notes, and correction workflow.

sectionsPrimary home sections and anchor nodes

semanticGroupsColor knowledge graph groups

endpointsStatic JSON and manifest resources

relationshipsHuman navigation hubs connected from home

ingestionNotesGuidance for AI and dataset crawlers

Structured sections

sections

[
  "hero",
  "explore_color_systems",
  "professional_color_tools",
  "dataset_api_hub",
  "trust_editorial",
  "footer"
]

semanticGroups

[
  "color_families",
  "tones",
  "temperature",
  "luminance",
  "wcag",
  "palettes",
  "brand_colors",
  "hex_atlas"
]

endpoints

{
  "index": "/api/index.json",
  "colors": "/api/colors.json",
  "hex": "/api/hex.json",
  "palettes": "/api/palettes.json",
  "harmonies": "/api/harmonies.json",
  "comparisons": "/api/compare.json",
  "brands": "/api/brand-colors.json",
  "tools": "/api/tools.json",
  "wcag": "/api/wcag/accessible-colors.json",
  "manifest": "/dataset/manifest.json"
}

relationships

{
  "explorer": "/color-explorer/",
  "namedColors": "/colors/",
  "colorFamilies": "/colors/families/",
  "hexAtlas": "/hex/",
  "brandColors": "/brand-colors/",
  "tools": "/tools/",
  "dataset": "/dataset/",
  "aiPolicy": "/ai-access-policy/"
}

Full JSON dataset

{
  "page": "home",
  "version": "1.0.0",
  "sections": [
    "hero",
    "explore_color_systems",
    "professional_color_tools",
    "dataset_api_hub",
    "trust_editorial",
    "footer"
  ],
  "semanticGroups": [
    "color_families",
    "tones",
    "temperature",
    "luminance",
    "wcag",
    "palettes",
    "brand_colors",
    "hex_atlas"
  ],
  "endpoints": {
    "index": "/api/index.json",
    "colors": "/api/colors.json",
    "hex": "/api/hex.json",
    "palettes": "/api/palettes.json",
    "harmonies": "/api/harmonies.json",
    "comparisons": "/api/compare.json",
    "brands": "/api/brand-colors.json",
    "tools": "/api/tools.json",
    "wcag": "/api/wcag/accessible-colors.json",
    "manifest": "/dataset/manifest.json"
  },
  "relationships": {
    "explorer": "/color-explorer/",
    "namedColors": "/colors/",
    "colorFamilies": "/colors/families/",
    "hexAtlas": "/hex/",
    "brandColors": "/brand-colors/",
    "tools": "/tools/",
    "dataset": "/dataset/",
    "aiPolicy": "/ai-access-policy/"
  },
  "ingestionNotes": "Use the home page as the root node for discovering human navigation hubs, static JSON endpoints, dataset versioning, editorial trust pages, and Pay Per Crawl guidance."
}