Seedling to Cotton Ball Color Palette

About this palette

Seedling to Cotton Ball is a 5-color pastel, light palette: #BCCAA6 (Seedling), #E8C1C0 (Berry Good), #EDDBA4 (Tortilla), #CBF0E4 (Caribbean), #F0F8FF (Cotton Ball). It mixes green, pink, yellow, turquoise, white tones and feels balanced overall. The strongest text pairing is #BCCAA6 on #F0F8FF with a contrast ratio of 1.61:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Seedling	rgb(188, 202, 166)	hsl(83, 25%, 72%)
Berry Good	rgb(232, 193, 192)	hsl(1, 47%, 83%)
Tortilla	rgb(237, 219, 164)	hsl(45, 67%, 79%)
Caribbean	rgb(203, 240, 228)	hsl(161, 55%, 87%)
Cotton Ball	rgb(240, 248, 255)	hsl(208, 100%, 97%)

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.

Color blindness preview

CSS variables

/* Seedling to Cotton Ball — https://swatchly.xyz/palette/bccaa6-e8c1c0-eddba4-cbf0e4-f0f8ff */
:root {
  --seedling: #bccaa6;
  --berry-good: #e8c1c0;
  --tortilla: #eddba4;
  --caribbean: #cbf0e4;
  --cotton-ball: #f0f8ff;
}

Tailwind CSS v4

/* Seedling to Cotton Ball — https://swatchly.xyz/palette/bccaa6-e8c1c0-eddba4-cbf0e4-f0f8ff */
@theme {
  --color-seedling: #bccaa6;
  --color-seedling-50: #f2fae6;
  --color-seedling-100: #e8f1db;
  --color-seedling-200: #d4dfc4;
  --color-seedling-300: #bccaa6;
  --color-seedling-400: #9daa88;
  --color-seedling-500: #818e6c;
  --color-seedling-600: #667252;
  --color-seedling-700: #505b3d;
  --color-seedling-800: #3d472d;
  --color-seedling-900: #2e3621;
  --color-seedling-950: #1c2212;
  --color-berry-good: #e8c1c0;
  --color-berry-good-50: #fff9f9;
  --color-berry-good-100: #ffeeee;
  --color-berry-good-200: #f5d9d8;
  --color-berry-good-300: #e8c1c0;
  --color-berry-good-400: #c4a0a0;
  --color-berry-good-500: #a78382;
  --color-berry-good-600: #896766;
  --color-berry-good-700: #6e4f4f;
  --color-berry-good-800: #573c3c;
  --color-berry-good-900: #422c2c;
  --color-berry-good-950: #2a1a1a;
  --color-tortilla: #eddba4;
  --color-tortilla-50: #fff8e2;
  --color-tortilla-100: #f9efce;
  --color-tortilla-200: #eddba4;
  --color-tortilla-300: #d3c497;
  --color-tortilla-400: #b4a371;
  --color-tortilla-500: #988753;
  --color-tortilla-600: #7c6c39;
  --color-tortilla-700: #635525;
  --color-tortilla-800: #4e4117;
  --color-tortilla-900: #3d320d;
  --color-tortilla-950: #261e05;
  --color-caribbean: #cbf0e4;
  --color-caribbean-50: #e2f7f0;
  --color-caribbean-100: #cbf0e4;
  --color-caribbean-200: #bfdbd2;
  --color-caribbean-300: #a7c6bc;
  --color-caribbean-400: #86a89d;
  --color-caribbean-500: #6b8d83;
  --color-caribbean-600: #527369;
  --color-caribbean-700: #3e5d53;
  --color-caribbean-800: #2e4941;
  --color-caribbean-900: #223831;
  --color-caribbean-950: #13231e;
  --color-cotton-ball: #f0f8ff;
  --color-cotton-ball-50: #f0f8ff;
  --color-cotton-ball-100: #e8edf1;
  --color-cotton-ball-200: #d4d9de;
  --color-cotton-ball-300: #bcc3c8;
  --color-cotton-ball-400: #9ca3a9;
  --color-cotton-ball-500: #80878e;
  --color-cotton-ball-600: #666d73;
  --color-cotton-ball-700: #50565b;
  --color-cotton-ball-800: #3e4348;
  --color-cotton-ball-900: #2f3337;
  --color-cotton-ball-950: #1c2022;
}