CSS Color: Ivory
Named CSS color Ivory — #FFFFF0 in HEX, rgb(255, 255, 240) in RGB, hsl(60, 100%, 97%) in HSL.
Color Values
| Format | Value | CSS Usage |
|---|---|---|
| Named | Ivory | color: Ivory; |
| HEX | #FFFFF0 | color: #FFFFF0; |
| RGB | rgb(255, 255, 240) | color: rgb(255, 255, 240); |
| HSL | hsl(60, 100%, 97%) | color: hsl(60, 100%, 97%); |
About Ivory
Ivory is a warm off-white with a subtle yellow tint, named after the material from elephant tusks. At hex `#FFFFF0`, both red and green are at maximum (255) while blue is slightly lower (240). This creates a warm, creamy undertone at 60 degrees (yellow) hue.
In web design, Ivory is a popular choice for backgrounds that need to feel warmer and more natural than pure white. It is commonly used in literature and reading-focused websites, luxury brands, and designs inspired by printed paper. The yellow tint reduces eye strain in prolonged reading.
For accessibility, Ivory provides nearly identical contrast to white. Dark text on Ivory maintains excellent readability. The contrast ratio between Ivory and white is negligible (about 1.01:1).
Ivory creates a sophisticated, classic atmosphere that pairs well with dark brown, gold, deep green, and burgundy. It is the off-white of choice for heritage brands and classic typography-focused designs. In Tailwind CSS, `yellow-50` provides a similar warm white.
FAQ
What is the hex code for Ivory?
The CSS named color Ivory has the hex code #FFFFF0. You can use it in CSS as color: #FFFFF0; or simply color: Ivory;.
What is Ivory in RGB?
In RGB notation, Ivory is rgb(255, 255, 240). Use it in CSS as color: rgb(255, 255, 240);.
What is Ivory in HSL?
In HSL notation, Ivory is hsl(60, 100%, 97%). Use it in CSS as color: hsl(60, 100%, 97%);.
What color category is Ivory?
Ivory belongs to the White/Black color family in the CSS named colors specification.
Can I use the name "Ivory" directly in CSS?
Yes. All modern browsers support CSS named colors. You can write color: Ivory; or background-color: Ivory; directly in your stylesheet. Named colors are case-insensitive.
Try in Color Converter
Convert Ivory to other formats, check contrast ratios, explore palettes, and find the closest Tailwind CSS class.
Open Color Converter →