Sitemap
Find a tool, color reference or guide. Shared tool results can also have their own URLs.
Tools and site information
- Color Wheel, Color Contrast & Palette Tools
- Color Difference Checker: Delta E & Contrast
- Color Contrast Checker & Fixer
- Link Contrast Checker: Link, Text & Background
- Color & Contrast Validation Data: 40 Reproducible Checks
- Color Converter
- Color Palette Generator & CSS Export
- Brand Palette Builder
- Color Names & HEX Codes: Find Your Color
- Color Palette Ideas & HEX Color Combinations
- Teal vs Turquoise: Color Differences & HEX Codes | Color Match
- Burgundy vs Maroon: Color Differences & HEX Codes | Color Match
- Navy Blue vs Royal Blue: Differences & HEX Codes | Color Match
- Purple vs Violet: CSS Color Differences & HEX Codes | Color Match
- Aqua vs Cyan: Are They the Same Color? | Color Match
- Gray vs Grey: Spelling, CSS Values & Color Codes | Color Match
- Pastel Color Palettes | Color Match
- Earth Tone Color Palettes | Color Match
- Neutral Color Palettes | Color Match
- Dark Mode Color Palettes | Color Match
- Image Color Picker
- How We Calculate Color & Contrast
- Editorial & Correction Policy
- About Color Match
- Contact Color Match
- Color Theory Guide
- Color Models Explained
- Color, Accessibility & Design Guides
- Privacy Policy
- Terms of Service
Guides
- Build an Accessible Color Palette by Assigning Roles First
- RGB to CMYK: Why a Web Conversion Is Only an Approximation
- Use the 60-30-10 Color Rule as a Layout Exercise
- Color Psychology: Test Associations in Context
- Build a Dark Mode Palette with Tested Color Roles
- WCAG Contrast Ratios: Calculate, Interpret and Fix a Failing Pair
- HSL Color Model: A Practical Guide for CSS
- Build a Brand Palette from Real Interface Roles
- Four Website Color Pairs to Test in 2026
- Design Color Cues That Remain Understandable
- CSS Color Functions: Values, Alpha and Fallbacks
- Choose Chart Colors by the Question and the Data
- Warm and Cool Colors: Compare the Context
- Choose Text Colors by Role and Background
- From Figma Color Decisions to Tested CSS Tokens
- Export Color Tokens for Tailwind CSS v3 and v4
- CSS Gradients: Interpolation, Stops and Readable Text
- UI Contrast: Check Labels, Boundaries and States Separately
- APCA and WCAG Contrast: Why the Numbers Differ
- OKLCH in CSS: Lightness, Chroma and Gamut
- How to Compare Two Colors for a Specific Design Role
- A Practical Color Accessibility Review Checklist
- Design Color Tokens with Explicit Roles and Tested Pairs
- CSS color-mix(): Weights, Spaces and Tested Results
- HEX to RGB: Convert Bytes, Expand Shorthand and Handle Alpha
- Five Web Palette Starting Points with Explicit Roles
- Using Red in Interfaces: Meaning, Roles and Contrast
- How to Audit Text Contrast on a Real Web Page
Color references
- #000000
- #0C0C0C
- #2A3439
- #191970
- #36454F
- #A9A9A9
- #D3D3D3
- #C0C0C0
- #808080
- #FFFFFF
- #FF0000
- #800000
- #DC143C
- #FF6347
- #FF7F50
- #FA8072
- #FFA500
- #FFD700
- #FFFF00
- #808000
- #00FF00
- #008000
- #50C878
- #008080
- #00FFFF
- #87CEEB
- #4169E1
- #0000FF
- #000080
- #4B0082
- #800080
- #EE82EE
- #FF00FF
- #FFC0CB
- #FF69B4
- #FF007F
- #A52A2A
- #D2691E
- #D2B48C
- #F5F5DC
- #708090
- #E6E6FA
- #BDFCC9
- #FFDAB9
- #FFFDD0
- #800020
- #CC7722
- #FFBF00
- #0047AB
- #007BA7
- #E0B0FF
- #C8A2C8
- #CCCCFF
- #93E1D8
- #228B22
- #4CBB17
- #E0115F
- #0F52BA
- #30D5C8
- #7FFFD4
- #40E0D0
- #9CAF88
- #FFFFF0
- #663399
Theme palettes
Palette examples
- #FF6B6B / #4ECDC4 / #FFE66D / #A8E6CF / #FFB347
- #000000 / #FFFFFF / #808080 / #C0C0C0 / #404040
- #264653 / #2A9D8F / #E9C46A / #F4A261 / #E76F51
- #003049 / #D62828 / #F77F00 / #FCBF49 / #EAE2B7
- #606C38 / #283618 / #FEFAE0 / #DDA15E / #BC6C25
- #111827 / #1F2937 / #F9FAFB / #9CA3AF / #93C5FD
- #FFF7ED / #172554 / #FF7F50 / #000000
- #F8FAFC / #FFFFFF / #0F172A / #1D4ED8
- #F3E8FF / #3B0764 / #A855F7 / #FFFFFF
- #FFEDD5 / #431407 / #C2410C / #FFFFFF