Cool Grey Colour Palette

About this palette

The Cool Grey colour palette brings together a set of shades that can be used across interiors, fashion, branding, websites, presentations and creative projects. It gives you a starting point for understanding how this colour behaves alongside lighter neutrals, deeper accents and supporting tones.

Use this palette when you want a ready-made colour direction rather than starting from a blank canvas. The colours included are #64748B, #CBD5E1, #F8FAFC, #0F172A, making it easy to copy the values into a design tool, CSS file, mood board or visual concept.

You can also explore related colour palettes, open the palette in the colour tool, or compare it with articles that use similar colour ideas.

Colours in this palette

Click any colour to copy the HEX value, or open the full palette in the colour tool to test harmonies, contrast and CSS export options.

How to use this palette

• For interiors: use the lighter shades for walls or backgrounds, then bring in the deeper shades through furniture, artwork, textiles or smaller accents.
• For websites: use the strongest colour as an accent, the lightest colour as a background and the darkest colour for readable text.
• For branding: pick one dominant colour, one neutral and one contrast colour so the palette feels recognisable rather than crowded.

CSS colour variables

Copy these variables into your stylesheet or design system.

:root {
  --palette-colour-1: #64748B;
  --palette-colour-2: #CBD5E1;
  --palette-colour-3: #F8FAFC;
  --palette-colour-4: #0F172A;
}