#6B4E1E
#00B8C4
#E8DCC0
#F7F3EA
#3C4B2CTaupe
#74814CShadow
#FCBE7BApricot
#FFFBE2Ivory
Apricot & Shadow Mood is a analogous color palette tagged modern, brown, beige. Analogous neighbors on the wheel (Taupe, Shadow, Apricot) 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 |
|---|---|---|---|---|---|
| Taupe | #3C4B2C | rgb(60, 75, 44) | hsl(89, 26%, 23%) | oklch(39.1% 0.053 130) | |
| Shadow | #74814C | rgb(116, 129, 76) | hsl(75, 26%, 40%) | oklch(57.9% 0.077 120) | |
| Apricot | #FCBE7B | rgb(252, 190, 123) | hsl(31, 96%, 74%) | oklch(84.4% 0.110 68) | |
| Ivory | #FFFBE2 | rgb(255, 251, 226) | hsl(52, 100%, 94%) | oklch(98.5% 0.033 100) |
Why it works and how to use it
It works because the lightness range is wide (23% to 94%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Ivory (#FFFBE2) is the lightest color, so it belongs on large surfaces.
- Text: Taupe (#3C4B2C) on #FFFBE2 gives 9.02:1, passing WCAG AAA.
- Primary: Apricot (#FCBE7B) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Shadow (#74814C) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Taupe on Ivory at 9.02:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Apricot & Shadow Mood
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
#3C4B2C
#74814C
#FCBE7B
#FFFBE2
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#3C4B2C on #FFFBE2 | Aa | 9.02:1 | AAA |
#3C4B2C on #FCBE7B | Aa | 5.72:1 | AA |
#74814C on #FFFBE2 | Aa | 4.04:1 | AA large only |
#74814C on #FCBE7B | Aa | 2.56:1 | Fail |
#3C4B2C on #74814C | Aa | 2.23:1 | Fail |
#FCBE7B on #FFFBE2 | Aa | 1.58:1 | Fail |
Similar palettes 24 more in this mood
#6E5700
#7EC26E
#CCFFE7
#FDFDFD
#9D4500
#4B6642
#CDD6B4
#F6F3E9
#2469A5
#C97D5A
#E8C9A8
#F8F1E7
#7A8966
#CECEA4
#F4F9F4
#FFB7BA
#8B5E1E
#AD9FFA
#F3D48A
#FFF8E5
#B00020
#B28B00
#FFB4AB
#FDFDFD
#BF6664
#293548
#F4F9F2
#E6D59B
#D0423B
#767D50
#EDE6C3
#FDFAF0
#6B4E1E
#A791EC
#E8DCC0
#F7F3EA
#FCF8F4
#F0DAC0
#DE9F7B
#2D2E3A
#497205
#D07A4C
#F1DCC2
#FBF6EF
#A42677
#735831
#E9CAB4
#F6F3E9
#DB956B
#E6BC89
#588B8D
#F8F8F8
#5C8D89
#A7D7C5
#F4F9F4
#F2C57C
#FFF8F0
#FFD2CB
#FF819E
#1B3240
#924A43
#5C6049
#D5D2BF
#F5F3ED
#FFA878
#FFD8B7
#2A4366
#FAFAFA
#FDFDFF
#FFDFBC
#B9B9B9
#222222
#8D5A56
#BBA690
#F297AF
#F7D8CA
#4A3222
#8B5E3C
#72D1FF
#FFF8EC
#F8FFFF
#5CB7B8
#FFABBA
#919191
#1B1B1B
#BF9800
#CC3BB1
#F2F2F2
#655B57
#F36893
#C3A7A5
#FFF1E6