# ColorFYI

> Comprehensive color reference for developers and designers. 16.7M hex colors computed on-the-fly, 809 named colors (CSS, X11, Crayola, Pantone, RAL, NCS), 544 brand color palettes, 103 color theory glossary terms, 215 blog articles, and 6 interactive tools (WCAG contrast, converter, palette generator, shade generator, color blindness simulator, gradient generator).

## Data Scope
- 16.7M hex colors with RGB, HSL, HSV, CMYK, OKLCH values computed on-the-fly (<1ms)
- 809 named colors across 9 sources: CSS, X11, Crayola, Pantone, RAL, NCS, Brand, Cultural, Custom
- 544 brand color palettes (484 regular + 60 crypto) with 1,335 individual brand colors
- 23+ themed color collections (Pantone, Tailwind CSS, Radix UI, Ant Design, Obangsaek, Japanese Traditional)
- 103 color theory glossary terms with definitions and related resources
- 139 color name glossary entries with etymology, history, and cultural significance
- 215 blog articles across 8 categories (color theory, brand stories, design guides)
- 15 curated color palettes
- 6 interactive tools: WCAG Contrast Checker, Color Converter, Palette Generator, Shade Generator, Color Blindness Simulator, Gradient Generator
- Color harmonies: complementary, triadic, tetradic, split-complementary, analogous
- WCAG 2.1 contrast ratio with AA/AAA compliance checks
- Tailwind-style shade scales (50-950) for any color
- Color blindness simulation: deuteranopia, protanopia, tritanopia

## URL Patterns
- Append `.md` to any URL for plain-text markdown format.
- i18n: URL prefix `/{lang}` for non-English (ko, ja, zh-hans, es, fr, de, pt, ru, vi, tr, ar, hi, th, id).
- `/color/{hex}/` — Color detail page for any 6-digit hex (e.g. `/color/FF6B35/`)
- `/color/{slug}/` — Named color by slug (e.g. `/color/cerulean/`)
- `/color/named/` — Browse all 809 named colors with source filter (e.g. `/color/named/`)
- `/color/rgb-{R}-{G}-{B}/` — RGB redirect to hex detail (e.g. `/color/rgb-14-165-233/`)
- `/color/hsl-{H}-{S}-{L}/` — HSL redirect to hex detail (e.g. `/color/hsl-199-89-48/`)
- `/family/` — Color families (red, blue, green, ...) (e.g. `/family/`)
- `/family/{slug}/` — Color family detail (e.g. `/family/red/`)
- `/tone/` — Color tones (pastel, neon, earth, ...) (e.g. `/tone/`)
- `/tone/{slug}/` — Color tone detail (e.g. `/tone/pastel/`)
- `/design-system/` — Design system color palettes (e.g. `/design-system/`)
- `/design-system/{slug}/` — Design system detail (e.g. `/design-system/tailwind/`)
- `/meaning/` — Color meanings and symbolism (e.g. `/meaning/`)
- `/meaning/{slug}/` — Color meaning detail (e.g. `/meaning/romantic/`)
- `/brands/` — Brand color palettes grouped by category (e.g. `/brands/`)
- `/brands/{slug}/` — Brand color palette detail (e.g. `/brands/google/`)
- `/brands/category/{cat}/` — Brand category page (e.g. `/brands/category/tech/`)
- `/collections/` — Themed color collections (e.g. `/collections/`)
- `/collections/{slug}/` — Collection detail (e.g. `/collections/korean-obangsaek/`)
- `/collections/category/{cat}/` — Collection category page (e.g. `/collections/category/cultural/`)
- `/glossary/` — Color name glossary index (e.g. `/glossary/`)
- `/glossary/{slug}/` — Color name: etymology, history, usage (e.g. `/glossary/aquamarine/`)
- `/glossary/terms/{slug}/` — Color theory term definition (e.g. `/glossary/terms/hue/`)
- `/palettes/` — Curated color palettes (e.g. `/palettes/`)
- `/palettes/{slug}/` — Palette detail (e.g. `/palettes/cherry-blossom/`)
- `/blog/` — Color articles and guides (e.g. `/blog/`)
- `/blog/{slug}/` — Blog article (e.g. `/blog/korean-obangsaek/`)
- `/blog/category/{slug}/` — Blog category (e.g. `/blog/category/color-theory/`)
- `/tools/` — Interactive color tools index (e.g. `/tools/`)
- `/tools/{slug}/` — Tool page (e.g. `/tools/contrast-checker/`)
- `/compare/` — Color comparison tool (e.g. `/compare/`)
- `/compare/{hex1}-vs-{hex2}/` — Compare two colors (e.g. `/compare/000000-vs-FFFFFF/`)
- `/compare/{hex1}-vs-{hex2}-vs-{hex3}/` — Compare three colors (e.g. `/compare/FF0000-vs-00FF00-vs-0000FF/`)
- `/graph/` — Interactive color knowledge graph (e.g. `/graph/`)
- `/search/` — Search named colors, brands, collections (e.g. `/search/?q=blue`)

## Browse Colors
- [All Named Colors (809)](https://colorfyi.com/color/named/)
- [Color Families](https://colorfyi.com/family/)
- [Color Tones](https://colorfyi.com/tone/)
- [Design Systems](https://colorfyi.com/design-system/)
- [Color Meanings](https://colorfyi.com/meaning/)

## Interactive Tools
- [WCAG Contrast Checker](https://colorfyi.com/tools/contrast-checker/)
- [Color Converter (HEX/RGB/HSL/CMYK/OKLCH)](https://colorfyi.com/tools/converter/)
- [Palette Generator (Harmonies)](https://colorfyi.com/tools/palette-generator/)
- [Shade Generator (Tailwind-style 50-950)](https://colorfyi.com/tools/shade-generator/)
- [Color Blindness Simulator](https://colorfyi.com/tools/color-blindness-simulator/)
- [Gradient Generator (CSS)](https://colorfyi.com/tools/gradient-generator/)
- [Color Comparison Tool](https://colorfyi.com/compare/)

## Brand Colors
- [All Brands (544)](https://colorfyi.com/brands/)
- [Technology](https://colorfyi.com/brands/category/tech/)
- [Social Media](https://colorfyi.com/brands/category/social/)
- [Cryptocurrency](https://colorfyi.com/brands/category/crypto/)
- [Fashion](https://colorfyi.com/brands/category/fashion/)
- [Food & Beverage](https://colorfyi.com/brands/category/food/)
- [Finance](https://colorfyi.com/brands/category/finance/)
- [Design](https://colorfyi.com/brands/category/design/)

## Color Collections
- [All Collections](https://colorfyi.com/collections/)
- [Korean Obangsaek](https://colorfyi.com/collections/korean-obangsaek/)
- [Japanese Traditional](https://colorfyi.com/collections/japanese-traditional/)
- [Pantone Color of the Year 2025](https://colorfyi.com/collections/pantone-2025/)
- [Tailwind CSS Colors](https://colorfyi.com/collections/tailwind-red/)
- [Radix UI Colors](https://colorfyi.com/collections/radix-tomato/)
- [Ant Design Colors](https://colorfyi.com/collections/antd-red/)
- [Cultural](https://colorfyi.com/collections/category/cultural/)
- [Design Systems](https://colorfyi.com/collections/category/design/)

## Glossary
- [Color Name Glossary (139 entries)](https://colorfyi.com/glossary/)
- [Color Theory Terms (103 terms)](https://colorfyi.com/glossary/?view=terms)

## Blog
- [All Articles (215)](https://colorfyi.com/blog/)
- [Korean Obangsaek: Five Directional Colors](https://colorfyi.com/blog/korean-obangsaek/)
- [Psychology of Yellow](https://colorfyi.com/blog/psychology-of-yellow/)
- [Color Theory](https://colorfyi.com/blog/category/color-theory/)
- [Brand Stories](https://colorfyi.com/blog/category/brand-stories/)
- [Design Guides](https://colorfyi.com/blog/category/design-guides/)

## Palettes
- [Curated Palettes (15)](https://colorfyi.com/palettes/)

## Knowledge Graph
- [Interactive Color Knowledge Graph](https://colorfyi.com/graph/)

## Embed Widget
- [ColorFYI Widget Docs](https://widget.colorfyi.com)
- [colorfyi-embed on npm](https://www.npmjs.com/package/colorfyi-embed)
- [colorfyi-embed on GitHub](https://github.com/fyipedia/colorfyi-embed)

## REST API

Free REST API. No authentication required. JSON responses. CORS enabled.

| Method | Endpoint | Description |
|--------|----------|-------------|
| GET | `/api/color/{hex}/` | Full color info (RGB, HSL, HSV, CMYK, OKLCH, harmonies, shades) |
| GET | `/api/contrast/?fg={hex}&bg={hex}` | WCAG contrast ratio + AA/AAA compliance |
| GET | `/api/search/?q={query}` | Search named colors and brands |
| GET | `/api/harmonies/{hex}/` | Color harmonies (complementary, triadic, etc.) |
| GET | `/api/shades/{hex}/` | Tailwind-style shade scale (50-950) |
| GET | `/api/blindness/{hex}/` | Color blindness simulation |
| GET | `/api/compare/?colors={hex1},{hex2}` | Compare multiple colors |
| GET | `/api/mix/?colors={hex1},{hex2}` | Mix colors |
| GET | `/api/gradient/?from={hex}&to={hex}` | Generate gradient steps |
| GET | `/api/palette/{hex}/` | Palette suggestions for a color |
| GET | `/api/named-colors/` | List all named colors |
| GET | `/api/graph/` | Knowledge graph nodes and edges |
| GET | `/api/v1/colors/` | Named colors (DRF, paginated) |
| GET | `/api/v1/brands/` | Brands (DRF, paginated) |
| GET | `/api/v1/posts/` | Blog posts (DRF, paginated) |
| GET | `/api/v1/glossary/` | Glossary terms (DRF, paginated) |
| GET | `/api/v1/collections/` | Collections (DRF, paginated) |
| GET | `/api/v1/tools/` | Interactive tools (DRF, paginated) |
| GET | `/api/v1/faqs/` | FAQs (DRF, paginated) |
| GET | `/api/v1/search/?q={query}` | Unified search (DRF) |
| GET | `/api/v1/stats/` | Site statistics |

```bash
curl -s "https://colorfyi.com/api/color/FF6B35/"
```

[API Docs](https://colorfyi.com/developers/) · [OpenAPI Spec](https://colorfyi.com/api/openapi.json)

## Developer Tools
- **PyPI**: `pip install colorfyi` — [colorfyi](https://pypi.org/project/colorfyi/) — Color conversion, WCAG contrast, harmonies (v0.2.2)
- **npm**: `npm install @fyipedia/colorfyi` — [@fyipedia/colorfyi](https://www.npmjs.com/package/@fyipedia/colorfyi) — TypeScript color utilities (v0.1.2)
- **Embed Widget**: [colorfyi-embed](https://widget.colorfyi.com)

## Creative FYI Family

Part of [FYIPedia](https://fyipedia.com) developer tools ecosystem.
- [FontFYI](https://fontfyi.com) — Google Fonts metadata, CSS generation, pairings
- [EmojiFYI](https://emojifyi.com) — 3,953 emojis, Unicode Emoji 16.0, 8 encodings
- [SymbolFYI](https://symbolfyi.com) — Symbol encoding in 11 formats, Unicode properties
- [UnicodeFYI](https://unicodefyi.com) — Unicode characters, 17 encodings, HTML entities

## Images (CDN)

OG images for all entities at https://cdn.colorfyi.com/og/{type}/{slug}.png
- https://cdn.colorfyi.com/og/homepage.png
- https://cdn.colorfyi.com/og/brands/google.png
- https://cdn.colorfyi.com/og/collections/korean-obangsaek.png

## Full Index
- [Full content index](https://colorfyi.com/llms-full.txt)
- [XML Sitemap](https://colorfyi.com/sitemap.xml)