Flat Design Color Palette

Bright, unshaded colors like turquoise, pomegranate red, sunflower yellow, and emerald define the flat design movement. This UI-focused palette powers web app interfaces, icon sets, and infographic design.

#1ABC9C

Teal

RGB(26, 188, 156)

HSL(168, 76%, 42%)

#E74C3C

Red

RGB(231, 76, 60)

HSL(6, 78%, 57%)

#F1C40F

Vivid Amber

RGB(241, 196, 15)

HSL(48, 89%, 50%)

#2ECC71

Green

RGB(46, 204, 113)

HSL(145, 63%, 49%)

#3498DB

Blue

RGB(52, 152, 219)

HSL(204, 70%, 53%)

#ECF0F1

Dusty Cyan

RGB(236, 240, 241)

HSL(192, 15%, 94%)

lightbulbBest Use Cases

  • checkWeb app interfaces
  • checkIcon sets
  • checkInfographics

businessIndustries

  • checkTechnology
  • checkDesign
Mood:clear

codeUse in Your Code

CSS Custom Properties

:root {
  --color-1: #1ABC9C;
  --color-2: #E74C3C;
  --color-3: #F1C40F;
  --color-4: #2ECC71;
  --color-5: #3498DB;
  --color-6: #ECF0F1;
}

Tailwind CSS Config

colors: {
  'flat-design-1': '#1ABC9C',
  'flat-design-2': '#E74C3C',
  'flat-design-3': '#F1C40F',
  'flat-design-4': '#2ECC71',
  'flat-design-5': '#3498DB',
  'flat-design-6': '#ECF0F1',
}
flatbrightuiwebclean

Want to Extract Colors from Your Own Images?

Upload any photo and get a custom color palette instantly — free.

Try PaletteAI Free

Related Palettes