About HTML Color Names
HTML color names are predefined color keywords that can be used in CSS and HTML to specify colors without needing to remember hex or RGB values. All modern browsers support these 140+ named colors, making them a convenient choice for web development.
How to Use HTML Color Names
You can use HTML color names in various ways:
- CSS:
color: Red;orbackground-color: DodgerBlue; - Inline HTML:
<div style="color: Tomato;"> - JavaScript:
element.style.color = "MediumSeaGreen"; - SVG:
<rect fill="CornflowerBlue" />
Color Categories
- Basic Colors: Red, Blue, Green, Yellow, Black, White
- Extended Colors: DodgerBlue, Crimson, ForestGreen, Gold
- Light Variants: LightBlue, LightGreen, LightPink, LightGray
- Dark Variants: DarkBlue, DarkGreen, DarkRed, DarkGray
- Medium Variants: MediumBlue, MediumPurple, MediumSeaGreen
Browser Support
All 140 HTML color names are supported by all modern browsers including Chrome, Firefox, Safari, Edge, and Opera. The color names are case-insensitive, so "Red", "red", and "RED" all work the same.
Benefits of Using Color Names
- Easy to remember and type
- More readable code
- No need to look up hex or RGB values
- Consistent across all browsers
- Great for prototyping and quick styling
When to Use Hex vs Color Names
Use Color Names: For quick prototyping, learning, or when you need common colors.Use Hex/RGB: For brand-specific colors, precise color matching, or when you need colors not in the named color list.