← Back to Tools
Design tropical spa resort branding with this teal and coral palette featuring #008B8B dark teal, #FF7F50 vibrant coral, #20B2AA light sea green, and #FFA07A salmon coral.
Export
Copy or download this palette as CSS, SCSS, Tailwind config, JSON, CSV, GPL, ASE or ACO.
:root {
--dark-teal: #008B8B;
--dark-teal-50: #f1ffff;
--dark-teal-100: #e4fcfc;
--dark-teal-200: #cbf6f5;
--dark-teal-300: #a8edec;
--dark-teal-400: #76e0df;
--dark-teal-500: #008B8B;
--dark-teal-600: #00a5a6;
--dark-teal-700: #007677;
--dark-teal-800: #00494a;
--dark-teal-900: #002324;
--dark-teal-950: #000606;
--vibrant-coral: #FF7F50;
--vibrant-coral-50: #fffbf7;
--vibrant-coral-100: #fff7ef;
--vibrant-coral-200: #ffeee2;
--vibrant-coral-300: #ffe3cf;
--vibrant-coral-400: #ffd3b8;
--vibrant-coral-500: #FF7F50;
--vibrant-coral-600: #da9c7c;
--vibrant-coral-700: #9f6b4f;
--vibrant-coral-800: #663e29;
--vibrant-coral-900: #341b0e;
--vibrant-coral-950: #0c0401;
--light-sea-green: #20B2AA;
--light-sea-green-50: #f4ffff;
--light-sea-green-100: #eafefd;
--light-sea-green-200: #d6faf8;
--light-sea-green-300: #bbf5f2;
--light-sea-green-400: #97ede9;
--light-sea-green-500: #20B2AA;
--light-sea-green-600: #47b9b5;
--light-sea-green-700: #168481;
--light-sea-green-800: #005250;
--light-sea-green-900: #002827;
--light-sea-green-950: #000707;
--salmon-coral: #FFA07A;
--salmon-coral-50: #fffcf9;
--salmon-coral-100: #fff9f4;
--salmon-coral-200: #fff3eb;
--salmon-coral-300: #ffebde;
--salmon-coral-400: #ffe0ce;
--salmon-coral-500: #FFA07A;
--salmon-coral-600: #daae98;
--salmon-coral-700: #9d7966;
--salmon-coral-800: #64483a;
--salmon-coral-900: #332118;
--salmon-coral-950: #0b0503;
}
$dark-teal: #008B8B; $dark-teal-50: #f1ffff; $dark-teal-100: #e4fcfc; $dark-teal-200: #cbf6f5; $dark-teal-300: #a8edec; $dark-teal-400: #76e0df; $dark-teal-500: #008B8B; $dark-teal-600: #00a5a6; $dark-teal-700: #007677; $dark-teal-800: #00494a; $dark-teal-900: #002324; $dark-teal-950: #000606; $vibrant-coral: #FF7F50; $vibrant-coral-50: #fffbf7; $vibrant-coral-100: #fff7ef; $vibrant-coral-200: #ffeee2; $vibrant-coral-300: #ffe3cf; $vibrant-coral-400: #ffd3b8; $vibrant-coral-500: #FF7F50; $vibrant-coral-600: #da9c7c; $vibrant-coral-700: #9f6b4f; $vibrant-coral-800: #663e29; $vibrant-coral-900: #341b0e; $vibrant-coral-950: #0c0401; $light-sea-green: #20B2AA; $light-sea-green-50: #f4ffff; $light-sea-green-100: #eafefd; $light-sea-green-200: #d6faf8; $light-sea-green-300: #bbf5f2; $light-sea-green-400: #97ede9; $light-sea-green-500: #20B2AA; $light-sea-green-600: #47b9b5; $light-sea-green-700: #168481; $light-sea-green-800: #005250; $light-sea-green-900: #002827; $light-sea-green-950: #000707; $salmon-coral: #FFA07A; $salmon-coral-50: #fffcf9; $salmon-coral-100: #fff9f4; $salmon-coral-200: #fff3eb; $salmon-coral-300: #ffebde; $salmon-coral-400: #ffe0ce; $salmon-coral-500: #FFA07A; $salmon-coral-600: #daae98; $salmon-coral-700: #9d7966; $salmon-coral-800: #64483a; $salmon-coral-900: #332118; $salmon-coral-950: #0b0503;
colors: {
'dark-teal': {
50: '#f1ffff',
100: '#e4fcfc',
200: '#cbf6f5',
300: '#a8edec',
400: '#76e0df',
500: '#008B8B',
600: '#00a5a6',
700: '#007677',
800: '#00494a',
900: '#002324',
950: '#000606',
DEFAULT: '#008B8B',
},
'vibrant-coral': {
50: '#fffbf7',
100: '#fff7ef',
200: '#ffeee2',
300: '#ffe3cf',
400: '#ffd3b8',
500: '#FF7F50',
600: '#da9c7c',
700: '#9f6b4f',
800: '#663e29',
900: '#341b0e',
950: '#0c0401',
DEFAULT: '#FF7F50',
},
'light-sea-green': {
50: '#f4ffff',
100: '#eafefd',
200: '#d6faf8',
300: '#bbf5f2',
400: '#97ede9',
500: '#20B2AA',
600: '#47b9b5',
700: '#168481',
800: '#005250',
900: '#002827',
950: '#000707',
DEFAULT: '#20B2AA',
},
'salmon-coral': {
50: '#fffcf9',
100: '#fff9f4',
200: '#fff3eb',
300: '#ffebde',
400: '#ffe0ce',
500: '#FFA07A',
600: '#daae98',
700: '#9d7966',
800: '#64483a',
900: '#332118',
950: '#0b0503',
DEFAULT: '#FFA07A',
},
},
[
{
"name": "dark-teal",
"harmony": "Palette",
"hex": "#008B8B",
"rgb": {
"r": 0,
"g": 139,
"b": 139
},
"hsl": {
"h": 180,
"s": 100,
"l": 27
},
"value": "#008B8B",
"tonalScale": {
"50": {
"hex": "#f1ffff",
"rgb": {
"r": 241,
"g": 255,
"b": 255
}
},
"100": {
"hex": "#e4fcfc",
"rgb": {
"r": 228,
"g": 252,
"b": 252
}
},
"200": {
"hex": "#cbf6f5",
"rgb": {
"r": 203,
"g": 246,
"b": 245
}
},
"300": {
"hex": "#a8edec",
"rgb": {
"r": 168,
"g": 237,
"b": 236
}
},
"400": {
"hex": "#76e0df",
"rgb": {
"r": 118,
"g": 224,
"b": 223
}
},
"500": {
"hex": "#008B8B",
"rgb": {
"r": 0,
"g": 139,
"b": 139
}
},
"600": {
"hex": "#00a5a6",
"rgb": {
"r": 0,
"g": 165,
"b": 166
}
},
"700": {
"hex": "#007677",
"rgb": {
"r": 0,
"g": 118,
"b": 119
}
},
"800": {
"hex": "#00494a",
"rgb": {
"r": 0,
"g": 73,
"b": 74
}
},
"900": {
"hex": "#002324",
"rgb": {
"r": 0,
"g": 35,
"b": 36
}
},
"950": {
"hex": "#000606",
"rgb": {
"r": 0,
"g": 6,
"b": 6
}
}
}
},
{
"name": "vibrant-coral",
"harmony": "Palette",
"hex": "#FF7F50",
"rgb": {
"r": 255,
"g": 127,
"b": 80
},
"hsl": {
"h": 16,
"s": 100,
"l": 66
},
"value": "#FF7F50",
"tonalScale": {
"50": {
"hex": "#fffbf7",
"rgb": {
"r": 255,
"g": 251,
"b": 247
}
},
"100": {
"hex": "#fff7ef",
"rgb": {
"r": 255,
"g": 247,
"b": 239
}
},
"200": {
"hex": "#ffeee2",
"rgb": {
"r": 255,
"g": 238,
"b": 226
}
},
"300": {
"hex": "#ffe3cf",
"rgb": {
"r": 255,
"g": 227,
"b": 207
}
},
"400": {
"hex": "#ffd3b8",
"rgb": {
"r": 255,
"g": 211,
"b": 184
}
},
"500": {
"hex": "#FF7F50",
"rgb": {
"r": 255,
"g": 127,
"b": 80
}
},
"600": {
"hex": "#da9c7c",
"rgb": {
"r": 218,
"g": 156,
"b": 124
}
},
"700": {
"hex": "#9f6b4f",
"rgb": {
"r": 159,
"g": 107,
"b": 79
}
},
"800": {
"hex": "#663e29",
"rgb": {
"r": 102,
"g": 62,
"b": 41
}
},
"900": {
"hex": "#341b0e",
"rgb": {
"r": 52,
"g": 27,
"b": 14
}
},
"950": {
"hex": "#0c0401",
"rgb": {
"r": 12,
"g": 4,
"b": 1
}
}
}
},
{
"name": "light-sea-green",
"harmony": "Palette",
"hex": "#20B2AA",
"rgb": {
"r": 32,
"g": 178,
"b": 170
},
"hsl": {
"h": 177,
"s": 70,
"l": 41
},
"value": "#20B2AA",
"tonalScale": {
"50": {
"hex": "#f4ffff",
"rgb": {
"r": 244,
"g": 255,
"b": 255
}
},
"100": {
"hex": "#eafefd",
"rgb": {
"r": 234,
"g": 254,
"b": 253
}
},
"200": {
"hex": "#d6faf8",
"rgb": {
"r": 214,
"g": 250,
"b": 248
}
},
"300": {
"hex": "#bbf5f2",
"rgb": {
"r": 187,
"g": 245,
"b": 242
}
},
"400": {
"hex": "#97ede9",
"rgb": {
"r": 151,
"g": 237,
"b": 233
}
},
"500": {
"hex": "#20B2AA",
"rgb": {
"r": 32,
"g": 178,
"b": 170
}
},
"600": {
"hex": "#47b9b5",
"rgb": {
"r": 71,
"g": 185,
"b": 181
}
},
"700": {
"hex": "#168481",
"rgb": {
"r": 22,
"g": 132,
"b": 129
}
},
"800": {
"hex": "#005250",
"rgb": {
"r": 0,
"g": 82,
"b": 80
}
},
"900": {
"hex": "#002827",
"rgb": {
"r": 0,
"g": 40,
"b": 39
}
},
"950": {
"hex": "#000707",
"rgb": {
"r": 0,
"g": 7,
"b": 7
}
}
}
},
{
"name": "salmon-coral",
"harmony": "Palette",
"hex": "#FFA07A",
"rgb": {
"r": 255,
"g": 160,
"b": 122
},
"hsl": {
"h": 17,
"s": 100,
"l": 74
},
"value": "#FFA07A",
"tonalScale": {
"50": {
"hex": "#fffcf9",
"rgb": {
"r": 255,
"g": 252,
"b": 249
}
},
"100": {
"hex": "#fff9f4",
"rgb": {
"r": 255,
"g": 249,
"b": 244
}
},
"200": {
"hex": "#fff3eb",
"rgb": {
"r": 255,
"g": 243,
"b": 235
}
},
"300": {
"hex": "#ffebde",
"rgb": {
"r": 255,
"g": 235,
"b": 222
}
},
"400": {
"hex": "#ffe0ce",
"rgb": {
"r": 255,
"g": 224,
"b": 206
}
},
"500": {
"hex": "#FFA07A",
"rgb": {
"r": 255,
"g": 160,
"b": 122
}
},
"600": {
"hex": "#daae98",
"rgb": {
"r": 218,
"g": 174,
"b": 152
}
},
"700": {
"hex": "#9d7966",
"rgb": {
"r": 157,
"g": 121,
"b": 102
}
},
"800": {
"hex": "#64483a",
"rgb": {
"r": 100,
"g": 72,
"b": 58
}
},
"900": {
"hex": "#332118",
"rgb": {
"r": 51,
"g": 33,
"b": 24
}
},
"950": {
"hex": "#0b0503",
"rgb": {
"r": 11,
"g": 5,
"b": 3
}
}
}
}
]
Name,Harmony,Hex,RGB,HSL,Value,T50,T100,T200,T300,T400,T500,T600,T700,T800,T900,T950 dark-teal,Palette,#008B8B,"rgb(0, 139, 139)","hsl(180, 100%, 27%)",#008B8B,#f1ffff,#e4fcfc,#cbf6f5,#a8edec,#76e0df,#008B8B,#00a5a6,#007677,#00494a,#002324,#000606 vibrant-coral,Palette,#FF7F50,"rgb(255, 127, 80)","hsl(16, 100%, 66%)",#FF7F50,#fffbf7,#fff7ef,#ffeee2,#ffe3cf,#ffd3b8,#FF7F50,#da9c7c,#9f6b4f,#663e29,#341b0e,#0c0401 light-sea-green,Palette,#20B2AA,"rgb(32, 178, 170)","hsl(177, 70%, 41%)",#20B2AA,#f4ffff,#eafefd,#d6faf8,#bbf5f2,#97ede9,#20B2AA,#47b9b5,#168481,#005250,#002827,#000707 salmon-coral,Palette,#FFA07A,"rgb(255, 160, 122)","hsl(17, 100%, 74%)",#FFA07A,#fffcf9,#fff9f4,#fff3eb,#ffebde,#ffe0ce,#FFA07A,#daae98,#9d7966,#64483a,#332118,#0b0503
GIMP Palette Name: PocketSwiss analogous Columns: 4 # 0 139 139 dark-teal 241 255 255 dark-teal-50 228 252 252 dark-teal-100 203 246 245 dark-teal-200 168 237 236 dark-teal-300 118 224 223 dark-teal-400 0 139 139 dark-teal-500 0 165 166 dark-teal-600 0 118 119 dark-teal-700 0 73 74 dark-teal-800 0 35 36 dark-teal-900 0 6 6 dark-teal-950 255 127 80 vibrant-coral 255 251 247 vibrant-coral-50 255 247 239 vibrant-coral-100 255 238 226 vibrant-coral-200 255 227 207 vibrant-coral-300 255 211 184 vibrant-coral-400 255 127 80 vibrant-coral-500 218 156 124 vibrant-coral-600 159 107 79 vibrant-coral-700 102 62 41 vibrant-coral-800 52 27 14 vibrant-coral-900 12 4 1 vibrant-coral-950 32 178 170 light-sea-green 244 255 255 light-sea-green-50 234 254 253 light-sea-green-100 214 250 248 light-sea-green-200 187 245 242 light-sea-green-300 151 237 233 light-sea-green-400 32 178 170 light-sea-green-500 71 185 181 light-sea-green-600 22 132 129 light-sea-green-700 0 82 80 light-sea-green-800 0 40 39 light-sea-green-900 0 7 7 light-sea-green-950 255 160 122 salmon-coral 255 252 249 salmon-coral-50 255 249 244 salmon-coral-100 255 243 235 salmon-coral-200 255 235 222 salmon-coral-300 255 224 206 salmon-coral-400 255 160 122 salmon-coral-500 218 174 152 salmon-coral-600 157 121 102 salmon-coral-700 100 72 58 salmon-coral-800 51 33 24 salmon-coral-900 11 5 3 salmon-coral-950
Binary ASE — use Download to save the file.
Binary ACO — use Download to save the file.