#B3001B
#E63946
#F8E9E9
#1D1D1D
#9E2A2BCranberry
#E09F3EMarigold
#FFF3B0Peach
#FFFFFFWhite
Rose Quartz is a analogous color palette tagged warm, red, white. Analogous neighbors on the wheel (Cranberry, Marigold, Peach) give it a natural, low-tension flow. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is warm.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Cranberry | #9E2A2B | rgb(158, 42, 43) | hsl(359, 58%, 39%) | oklch(46.8% 0.152 25) | |
| Marigold | #E09F3E | rgb(224, 159, 62) | hsl(36, 72%, 56%) | oklch(74.9% 0.134 74) | |
| Peach | #FFF3B0 | rgb(255, 243, 176) | hsl(51, 100%, 85%) | oklch(95.8% 0.086 99) | |
| White | #FFFFFF | rgb(255, 255, 255) | hsl(0, 0%, 100%) | oklch(100.0% 0.000 0) |
Why it works and how to use it
With 3 chromatic colors, Peach takes the lead while the rest support. Lightness runs from 39% to 100%. Well suited to websites, presentations and branding.
- Background: White (#FFFFFF) is the lightest color, so it belongs on large surfaces.
- Text: Cranberry (#9E2A2B) on #FFFFFF gives 7.45:1, passing WCAG AAA.
- Primary: Peach (#FFF3B0) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Marigold (#E09F3E) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Cranberry on White at 7.45:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Rose Quartz
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#9E2A2B
#E09F3E
#FFF3B0
#FFFFFF
Color-blind check: under tritanopia, Peach and White become hard to tell apart, so do not rely on that pair alone to carry meaning.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#9E2A2B on #FFFFFF | Aa | 7.45:1 | AAA |
#9E2A2B on #FFF3B0 | Aa | 6.63:1 | AA |
#9E2A2B on #E09F3E | Aa | 3.26:1 | AA large only |
#E09F3E on #FFFFFF | Aa | 2.28:1 | Fail |
#E09F3E on #FFF3B0 | Aa | 2.03:1 | Fail |
#FFF3B0 on #FFFFFF | Aa | 1.12:1 | Fail |
Similar palettes 24 more in this mood
#B22222
#165B33
#F8B229
#FFFFFF
#F24452
#FFD1DA
#FFF9F4
#75574E
#A62B1F
#D9553B
#F2B880
#FFF4E6
#D13135
#FF5A5F
#FFF8F8
#2C2C2C
#AC001A
#E99B00
#D1BF59
#FDFDFD
#8FCD9A
#D32636
#FBBFCC
#FDF9F3
#5A0F2D
#9E2A2B
#D4A373
#F5EBDD
#F4EFE7
#F0BAC5
#EE353E
#91C58A
#7B3F00
#C98A4B
#B3001B
#FFF8E7
#6F0002
#D62A3C
#FF514E
#FFEBE6
#CE403A
#2E6F46
#FFD593
#FAFAFA
#D7263D
#F6A5B7
#FFF1E6
#5A3E36
#B3001B
#F2A900
#1A1A1A
#FFF5E1
#792A2D
#B63845
#F6626A
#FFF7F7
#D3363D
#FF8474
#FFD9D4
#FAFAFA
#F9F3E8
#8DCB8E
#F5AFBE
#DF0A00
#6B0F1A
#B4364D
#F4B6C2
#FFF5F7
#CC2C31
#FFC464
#2A2A2A
#FFFAEF
#9B0012
#AD3D31
#352B15
#E4F4FF
#00653D
#C62A29
#EBC751
#FBF1E0
#FBF6ED
#E22036
#FFC5D1
#93DC9E
#C23B51
#E07585
#FFC49D
#F4F1DE
#F44942
#FF9B52
#FFE1B0
#FFFBE4