Instant Noodles to Borlotti Bean color palette

F5D093Instant Noodles FEF0FFPartial Pink ACE9E7Water Leaf F5D1E7Scented Spring D8B5B3Borlotti Bean

About this palette

Instant Noodles to Borlotti Bean is a 5-color pastel, light, warm palette: #F5D093 (Instant Noodles), #FEF0FF (Partial Pink), #ACE9E7 (Water Leaf), #F5D1E7 (Scented Spring), #D8B5B3 (Borlotti Bean). It mixes yellow, white, turquoise, pink tones and feels warm overall. The strongest text pairing is #FEF0FF on #D8B5B3 with a contrast ratio of 1.71:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Instant Noodles	rgb(245, 208, 147)	hsl(37, 83%, 77%)
Partial Pink	rgb(254, 240, 255)	hsl(296, 100%, 97%)
Water Leaf	rgb(172, 233, 231)	hsl(178, 58%, 79%)
Scented Spring	rgb(245, 209, 231)	hsl(323, 64%, 89%)
Borlotti Bean	rgb(216, 181, 179)	hsl(3, 32%, 77%)

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

/* Instant Noodles to Borlotti Bean — https://swatchly.xyz/palette/f5d093-fef0ff-ace9e7-f5d1e7-d8b5b3 */
:root {
  --instant-noodles: #f5d093;
  --partial-pink: #fef0ff;
  --water-leaf: #ace9e7;
  --scented-spring: #f5d1e7;
  --borlotti-bean: #d8b5b3;
}

Tailwind CSS v4

/* Instant Noodles to Borlotti Bean — https://swatchly.xyz/palette/f5d093-fef0ff-ace9e7-f5d1e7-d8b5b3 */
@theme {
  --color-instant-noodles: #f5d093;
  --color-instant-noodles-50: #fff2de;
  --color-instant-noodles-100: #fee7c1;
  --color-instant-noodles-200: #f5d093;
  --color-instant-noodles-300: #dabb88;
  --color-instant-noodles-400: #bd9b62;
  --color-instant-noodles-500: #a27f44;
  --color-instant-noodles-600: #86652a;
  --color-instant-noodles-700: #6d4f16;
  --color-instant-noodles-800: #573d08;
  --color-instant-noodles-900: #442e01;
  --color-instant-noodles-950: #2c1c00;
  --color-partial-pink: #fef0ff;
  --color-partial-pink-50: #fef0ff;
  --color-partial-pink-100: #f1e8f1;
  --color-partial-pink-200: #ded4df;
  --color-partial-pink-300: #c8bdc9;
  --color-partial-pink-400: #a99daa;
  --color-partial-pink-500: #8e818f;
  --color-partial-pink-600: #736774;
  --color-partial-pink-700: #5c515d;
  --color-partial-pink-800: #483f49;
  --color-partial-pink-900: #383038;
  --color-partial-pink-950: #231d23;
  --color-water-leaf: #ace9e7;
  --color-water-leaf-50: #e1fffe;
  --color-water-leaf-100: #d4f7f5;
  --color-water-leaf-200: #ace9e7;
  --color-water-leaf-300: #9ecfce;
  --color-water-leaf-400: #78b0ae;
  --color-water-leaf-500: #599492;
  --color-water-leaf-600: #3e7877;
  --color-water-leaf-700: #2a605f;
  --color-water-leaf-800: #1a4b4a;
  --color-water-leaf-900: #103a39;
  --color-water-leaf-950: #062424;
  --color-scented-spring: #f5d1e7;
  --color-scented-spring-50: #fff6fb;
  --color-scented-spring-100: #fee9f6;
  --color-scented-spring-200: #f5d1e7;
  --color-scented-spring-300: #d9bcce;
  --color-scented-spring-400: #ba9aae;
  --color-scented-spring-500: #9e7d92;
  --color-scented-spring-600: #816376;
  --color-scented-spring-700: #684c5e;
  --color-scented-spring-800: #523a49;
  --color-scented-spring-900: #402b38;
  --color-scented-spring-950: #291a23;
  --color-borlotti-bean: #d8b5b3;
  --color-borlotti-bean-50: #fff0ef;
  --color-borlotti-bean-100: #fbe3e2;
  --color-borlotti-bean-200: #e9cecd;
  --color-borlotti-bean-300: #d8b5b3;
  --color-borlotti-bean-400: #b79795;
  --color-borlotti-bean-500: #9c7c7a;
  --color-borlotti-bean-600: #816260;
  --color-borlotti-bean-700: #684d4b;
  --color-borlotti-bean-800: #533b3a;
  --color-borlotti-bean-900: #412d2c;
  --color-borlotti-bean-950: #291b1a;
}