#1B4332
#52B788
#E9F5F0
#007F7E
#1B6F73Pine
#47B377Jade
#F2CC8FApricot
#F4F1DEBeige
Bold Jade & Apricot is a complementary color palette tagged modern, teal, green. Near-complementary hues (about 146° apart) make this a high-contrast, attention-grabbing combination. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Pine | #1B6F73 | rgb(27, 111, 115) | hsl(183, 62%, 28%) | oklch(49.6% 0.076 200) | |
| Jade | #47B377 | rgb(71, 179, 119) | hsl(147, 43%, 49%) | oklch(68.9% 0.134 156) | |
| Apricot | #F2CC8F | rgb(242, 204, 143) | hsl(37, 79%, 75%) | oklch(86.4% 0.089 79) | |
| Beige | #F4F1DE | rgb(244, 241, 222) | hsl(52, 50%, 91%) | oklch(95.5% 0.025 100) |
Why it works and how to use it
It works because the lightness range is wide (28% to 91%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Beige (#F4F1DE) is the lightest color, so it belongs on large surfaces.
- Text: Pine (#1B6F73) on #F4F1DE gives 5.18:1, passing WCAG AA.
- Primary: Apricot (#F2CC8F) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Jade (#47B377) for highlights, badges and hover states.
1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Pine on Beige at 5.18:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Bold Jade & Apricot
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
#1B6F73
#47B377
#F2CC8F
#F4F1DE
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#1B6F73 on #F4F1DE | Aa | 5.18:1 | AA |
#1B6F73 on #F2CC8F | Aa | 3.87:1 | AA large only |
#47B377 on #F4F1DE | Aa | 2.32:1 | Fail |
#1B6F73 on #47B377 | Aa | 2.24:1 | Fail |
#47B377 on #F2CC8F | Aa | 1.73:1 | Fail |
#F2CC8F on #F4F1DE | Aa | 1.34:1 | Fail |
Similar palettes 24 more in this mood
#F9FFFC
#34FF8D
#5EEDFD
#343434
#00A6A6
#7DD8D8
#00C57C
#FDFDFD
#037B03
#F2C14E
#2E9CA6
#F4EBD9
#0F5C63
#2A8A8C
#9FD3CF
#F2F1EA
#222831
#575D65
#00ADB5
#EEEEEE
#FAFAFA
#E5E7EB
#10B981
#111827
#8A6800
#84A347
#00C38B
#56E7F4
#00818A
#009D8C
#31CA88
#ACE496
#ACB100
#FFB347
#0A9396
#F8F8F8
#00616A
#4DA27C
#98AA55
#FFCA7B
#6B4E1E
#00B8C4
#E8DCC0
#F7F3EA
#D7263D
#FFFFFF
#F9C5D1
#2E7D5B
#498711
#00AA6D
#00C0AE
#00DDF3
#1B4332
#52B788
#E9F5F0
#C9184A
#D2A04B
#757168
#5DF0DD
#F3FBFF
#A07200
#59964F
#8E9100
#44E9BE
#EDC27E
#B1C06C
#4A8E67
#006364
#00735C
#379879
#7DC5A6
#81E3CC
#E2D900
#6EB659
#00A381
#006C74
#2B2B2B
#4A4A4A
#00E9DB
#F5F5F5
#318994
#A2E5DE
#F3FCFF
#FFB092
#00B4B4
#008E90
#F5F0E1
#FD94A5
#FFFFFF
#E2E6E3
#059669
#111827