Vivid Coral Color Palette

A warm coral palette bridging orange and pink. Ideal for lifestyle, food, and social media brands.

Deep Coral

HEX: #991b1b

RGB: rgb(153, 27, 27)

HSL: hsl(0, 70%, 35%)

Rich Coral

HEX: #dc4a3f

RGB: rgb(220, 74, 63)

HSL: hsl(4, 69%, 55%)

Vivid Coral

HEX: #f97066

RGB: rgb(249, 112, 102)

HSL: hsl(4, 92%, 69%)

Salmon

HEX: #fca5a1

RGB: rgb(252, 165, 161)

HSL: hsl(3, 94%, 81%)

Coral Blush

HEX: #fde2e0

RGB: rgb(253, 226, 224)

HSL: hsl(4, 88%, 94%)

CSS Variables

:root {
  --vivid-coral-1: #991b1b;
  --vivid-coral-2: #dc4a3f;
  --vivid-coral-3: #f97066;
  --vivid-coral-4: #fca5a1;
  --vivid-coral-5: #fde2e0;
}

Tailwind CSS Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'vivid-coral': {
          '100': '#991b1b',
          '200': '#dc4a3f',
          '300': '#f97066',
          '400': '#fca5a1',
          '500': '#fde2e0',
        },
      },
    },
  },
}