Ivory is a warm near-white, named after elephant tusk. The CSS keyword ivory is #FFFFF0; design palettes usually sit a shade deeper, around #F5F0E1. Copy the HEX codes from any scheme below, or generate a harmonious ivory palette anchored to your own base colour.
Soft Ivory is the lightest, from #FFFFF7 down to #DDD3BC. Ivory & Cream is marginally yellower and gives one more usable step at #D0C3A5. Warm Ivory has the most contrast in it, reaching #BFAF8E at 65% lightness.
#FFFFF7#FBF7EC#F5F0E1#ECE4D0#DDD3BC#FFFEF5#FAF4E6#F0E9D6#E3D9C0#D0C3A5#FDFBF3#F5F0E1#E8DFCB#D6C9AE#BFAF8EAnchored to an ivory base — press Space or Generate to roll more schemes. Click a swatch to copy its HEX, lock one to keep it while the rest re-roll, then export as CSS, JSON or HEX.
Drag in the colour area or the hue bar, or type a HEX / RGB value, then build a scheme anchored to it.
Ivory is a ground colour and nothing on this page contrasts with anything else, so the first addition has to be dark — a charcoal, deep brown or black for text. After that it takes sage green, gold and burgundy particularly well, which is why wedding stationery, luxury packaging and editorial layouts default to it. See cream for the warmer, slightly deeper alternative.
:root block with each colour as a custom property (--color-1, --color-2 and so on), or copy a single HEX straight from any swatch above. On a narrow phone the generator shows four swatches instead of five, so the block you copy there carries four custom properties. Whatever the width, it rolls around #F5F0E1, the ivory this page is seeded with, so the export stays on-hue. Copy JSON and Copy HEX give the same values as an array and as a comma-separated line.More palettes: Cream palette · Beige palette · Coquette palette · all colours