Pastel Color Codes
Light, soft colors for backgrounds, tags, onboarding states, and gentle visual hierarchy.
Palette preview
9999cc
#9999CC9999ff#9999FF99cc99#99CC9999cccc#99CCCC99ccff#99CCFF99ff99#99FF9999ffcc#99FFCC99ffff#99FFFFAliceblue#F0F8FFAntiquewhite#FAEBD7Azure#F0FFFFBeige#F5F5DCBisque#FFE4C4Blanchedalmond#FFEBCDBurlywood#DEB887Cc9999#CC9999Cc99cc#CC99CCCc99ff#CC99FFCccc99#CCCC99Cccccc#CCCCCCCcccff#CCCCFFCcff99#CCFF99Ccffcc#CCFFCCCcffff#CCFFFFCornsilk#FFF8DCDarksalmon#E9967AFf9999#FF9999Ff99cc#FF99CCFf99ff#FF99FFFfcc99#FFCC99Ffcccc#FFCCCCFfccff#FFCCFFFfff99#FFFF99Ffffcc#FFFFCCFloralwhite#FFFAF0Gainsboro#DCDCDCGhostwhite#F8F8FFHoneydew#F0FFF0Ivory#FFFFF0Khaki#F0E68CLavender#E6E6FALavenderblush#FFF0F5Lemonchiffon#FFFACDLightblue#ADD8E6Lightcoral#F08080Lightcyan#E0FFFFLightgoldenrodyellow#FAFAD2Lightgray#D3D3D3Blue / Cyan
18 pages9999cc
#9999CC9999cc is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.9999ff#9999FF9999ff is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.99ccff#99CCFF99ccff is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Aliceblue#F0F8FFaliceblue is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Ccccff#CCCCFFCcccff is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Lavender#E6E6FAlavender is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightblue#ADD8E6lightblue is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightskyblue#87CEFAlightskyblue is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightsteelblue#B0C4DElightsteelblue is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Material Blue 1000#AFD9FBMaterial Blue 1000 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Blue 900#94CDF9Material Blue 900 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Blue Gray 1000#C6D0D5Material Blue Gray 1000 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Blue Gray 900#B3C1C7Material Blue Gray 900 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Cyan 1000#A3E7F0Material Cyan 1000 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Cyan 900#85DFEAMaterial Cyan 900 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Indigo 1000#BAC0E4Material Indigo 1000 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Indigo 800#8C97D3Material Indigo 800 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Indigo 900#A3ABDBMaterial Indigo 900 is a blue / cyan reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Green / Teal
17 pages99cc99
#99CC9999cc99 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.99cccc#99CCCC99cccc is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.99ff99#99FF9999ff99 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.99ffcc#99FFCC99ffcc is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.99ffff#99FFFF99ffff is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Azure#F0FFFFazure is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Ccffcc#CCFFCCCcffcc is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ccffff#CCFFFFCcffff is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Honeydew#F0FFF0honeydew is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightcyan#E0FFFFlightcyan is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightgreen#90EE90lightgreen is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Material Green 1000#BFE2C0Material Green 1000 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Green 700#7EC581Material Green 700 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Green 800#94CF96Material Green 800 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Green 900#A9D9ABMaterial Green 900 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Teal 1000#A3D9D4Material Teal 1000 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Teal 900#85CDC6Material Teal 900 is a green / teal reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Red / Orange
36 pagesAntiquewhite
#FAEBD7antiquewhite is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Beige#F5F5DCbeige is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Bisque#FFE4C4bisque is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Blanchedalmond#FFEBCDblanchedalmond is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Burlywood#DEB887burlywood is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Cccc99#CCCC99Cccc99 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Cornsilk#FFF8DCcornsilk is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Darksalmon#E9967Adarksalmon is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Ffcc99#FFCC99Ffcc99 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ffff99#FFFF99Ffff99 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ffffcc#FFFFCCFfffcc is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Floralwhite#FFFAF0floralwhite is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Ivory#FFFFF0ivory is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Khaki#F0E68Ckhaki is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lemonchiffon#FFFACDlemonchiffon is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightgoldenrodyellow#FAFAD2lightgoldenrodyellow is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightyellow#FFFFE0lightyellow is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Linen#FAF0E6linen is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Material Amber 1000#FFE9A6Material Amber 1000 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Amber 900#FFE188Material Amber 900 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Brown 1000#CFC2BDMaterial Brown 1000 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Brown 900#BFADA7Material Brown 900 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Deep Orange 1000#FFC3AFMaterial Deep Orange 1000 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Deep Orange 900#FFAE95Material Deep Orange 900 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Orange 1000#FFDAA3Material Orange 1000 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Red 1000#FBBBB7Material Red 1000 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Red 800#F88E86Material Red 800 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Red 900#FAA59FMaterial Red 900 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Yellow 1000#FFF8B8Material Yellow 1000 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Yellow 800#FFF389Material Yellow 800 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Yellow 900#FFF5A1Material Yellow 900 is a red / orange reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Mistyrose#FFE4E1mistyrose is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Moccasin#FFE4B5moccasin is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Navajowhite#FFDEADnavajowhite is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Oldlace#FDF5E6oldlace is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Palegoldenrod#EEE8AApalegoldenrod is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Magenta / Purple
12 pagesCc9999
#CC9999Cc9999 is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Cc99cc#CC99CCCc99cc is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ff9999#FF9999Ff9999 is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ff99cc#FF99CCFf99cc is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ff99ff#FF99FFFf99ff is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ffcccc#FFCCCCFfcccc is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Ffccff#FFCCFFFfccff is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Lavenderblush#FFF0F5lavenderblush is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightcoral#F08080lightcoral is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightpink#FFB6C1lightpink is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Material Pink 1000#F7AEC7Material Pink 1000 is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Pink 900#F493B4Material Pink 900 is a magenta / purple reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Purple / Blue
4 pagesCc99ff
#CC99FFCc99ff is a purple / blue reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Purple 1000#DBB1E3Material Purple 1000 is a purple / blue reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Purple 800#C47DD0Material Purple 800 is a purple / blue reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Purple 900#CF97D9Material Purple 900 is a purple / blue reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Grayscale
5 pagesCccccc
#CCCCCCCccccc is a grayscale reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Gainsboro#DCDCDCgainsboro is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Ghostwhite#F8F8FFghostwhite is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Lightgray#D3D3D3lightgray is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Mintcream#F5FFFAmintcream is a standard CSS named color. This reference page gives copy-ready HEX, RGB, HSL, HSV, CMYK, contrast, shades, harmonies, and practical UI usage notes.Yellow / Green
4 pagesCcff99
#CCFF99Ccff99 is a yellow / green reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Lime 1000#EDF2B8Material Lime 1000 is a yellow / green reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Lime 800#E1EA88Material Lime 800 is a yellow / green reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.Material Lime 900#E7EEA0Material Lime 900 is a yellow / green reference color with copy-ready CSS values, contrast checks, and nearby palette suggestions for interface and content design.