Start generating

Sneaky Sesame to Serene Sea color palette

856D3FSneaky SesameFFCECDLove Fumes7C3D36Red Robin052B39Oceanic Noir7CABC8Serene Sea
Open in generator Export PNG, PDF, ASE…

About this palette

Sneaky Sesame to Serene Sea is a 5-color warm, vintage palette: #856D3F (Sneaky Sesame), #FFCECD (Love Fumes), #7C3D36 (Red Robin), #052B39 (Oceanic Noir), #7CABC8 (Serene Sea). It mixes brown, pink, red, blue tones and feels warm overall. The strongest text pairing is #FFCECD on #052B39 with a contrast ratio of 10.60:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

ColorHEXRGBHSL
Sneaky Sesamergb(133, 109, 63)hsl(39, 36%, 38%)
Love Fumesrgb(255, 206, 205)hsl(1, 100%, 90%)
Red Robinrgb(124, 61, 54)hsl(6, 39%, 35%)
Oceanic Noirrgb(5, 43, 57)hsl(196, 84%, 12%)
Serene Seargb(124, 171, 200)hsl(203, 41%, 64%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

  • Aa10.60:1 Very good#FFCECD on #052B39
  • Aa10.60:1 Very good#052B39 on #FFCECD
  • Aa6.04:1 Good#052B39 on #7CABC8
  • Aa6.04:1 Good#7CABC8 on #052B39
  • Aa5.80:1 Good#FFCECD on #7C3D36
  • Aa5.80:1 Good#7C3D36 on #FFCECD
  • Aa3.52:1 Poor#856D3F on #FFCECD
  • Aa3.52:1 Poor#FFCECD on #856D3F

Color blindness preview

  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Achromatopsia
  • Dog vision

CSS variables

/* Sneaky Sesame to Serene Sea — https://swatchly.xyz/palette/856d3f-ffcecd-7c3d36-052b39-7cabc8 */
:root {
  --sneaky-sesame: #856d3f;
  --love-fumes: #ffcecd;
  --red-robin: #7c3d36;
  --oceanic-noir: #052b39;
  --serene-sea: #7cabc8;
}

Tailwind CSS v4

/* Sneaky Sesame to Serene Sea — https://swatchly.xyz/palette/856d3f-ffcecd-7c3d36-052b39-7cabc8 */
@theme {
  --color-sneaky-sesame: #856d3f;
  --color-sneaky-sesame-50: #fff4df;
  --color-sneaky-sesame-100: #fbeacc;
  --color-sneaky-sesame-200: #ead7b4;
  --color-sneaky-sesame-300: #d7c198;
  --color-sneaky-sesame-400: #baa275;
  --color-sneaky-sesame-500: #9f8758;
  --color-sneaky-sesame-600: #856d3f;
  --color-sneaky-sesame-700: #6b562b;
  --color-sneaky-sesame-800: #55421c;
  --color-sneaky-sesame-900: #423211;
  --color-sneaky-sesame-950: #2a1f07;
  --color-love-fumes: #ffcecd;
  --color-love-fumes-50: #fff6f5;
  --color-love-fumes-100: #ffe9e8;
  --color-love-fumes-200: #ffcecd;
  --color-love-fumes-300: #e1b9b8;
  --color-love-fumes-400: #c49897;
  --color-love-fumes-500: #a77b7b;
  --color-love-fumes-600: #8a6060;
  --color-love-fumes-700: #704a4a;
  --color-love-fumes-800: #593838;
  --color-love-fumes-900: #462a2a;
  --color-love-fumes-950: #2d1919;
  --color-red-robin: #7c3d36;
  --color-red-robin-50: #fff2f0;
  --color-red-robin-100: #ffe4e0;
  --color-red-robin-200: #ffc7c0;
  --color-red-robin-300: #edada5;
  --color-red-robin-400: #d08b82;
  --color-red-robin-500: #b36f66;
  --color-red-robin-600: #95554d;
  --color-red-robin-700: #7c3d36;
  --color-red-robin-800: #612f2a;
  --color-red-robin-900: #4d231e;
  --color-red-robin-950: #321410;
  --color-oceanic-noir: #052b39;
  --color-oceanic-noir-50: #e9f8ff;
  --color-oceanic-noir-100: #d8f0fb;
  --color-oceanic-noir-200: #c0ddea;
  --color-oceanic-noir-300: #a6c7d6;
  --color-oceanic-noir-400: #84a8b8;
  --color-oceanic-noir-500: #698e9f;
  --color-oceanic-noir-600: #517585;
  --color-oceanic-noir-700: #3e5f6e;
  --color-oceanic-noir-800: #2f4d5a;
  --color-oceanic-noir-900: #233d49;
  --color-oceanic-noir-950: #052b39;
  --color-serene-sea: #7cabc8;
  --color-serene-sea-50: #edf8ff;
  --color-serene-sea-100: #daf0ff;
  --color-serene-sea-200: #bcdff5;
  --color-serene-sea-300: #a1c9e3;
  --color-serene-sea-400: #7cabc8;
  --color-serene-sea-500: #618fab;
  --color-serene-sea-600: #47738e;
  --color-serene-sea-700: #325c74;
  --color-serene-sea-800: #23485d;
  --color-serene-sea-900: #183749;
  --color-serene-sea-950: #0b222f;
}

Similar palettes