Beach Bum — 5-color palette
#F4E1C1#E8B4A0#7AB8B0#3E5C76#1B2D45Hex codes
Hex
#F4E1C1
RGB
244, 225, 193
HSL
38°, 70%, 86%
Hex
#E8B4A0
RGB
232, 180, 160
HSL
17°, 61%, 77%
Hex
#7AB8B0
RGB
122, 184, 176
HSL
172°, 30%, 60%
Hex
#3E5C76
RGB
62, 92, 118
HSL
208°, 31%, 35%
Hex
#1B2D45
RGB
27, 45, 69
HSL
214°, 44%, 19%
How to use this palette
The first color in Beach Bum is the dominant tone — use it for primary surfaces and backgrounds. The middle three are the supporting palette: one warm, one cool, one neutral. The last is the accent — reserve it for highlights, calls-to-action, and emphasis.
For web projects, copy the CSS variables below. For print or illustration, use the hex codes directly. If you’re designing for accessibility, check the contrast between the text and background colors before you ship.
CSS
:root {
--beach-bum-1: #F4E1C1;
--beach-bum-2: #E8B4A0;
--beach-bum-3: #7AB8B0;
--beach-bum-4: #3E5C76;
--beach-bum-5: #1B2D45;
}