Colors Palettes: copy any color in one click
Click a swatch to copy its hex code. Browse 64+ palettes made for designers and developers. Free, with no sign-up.
How to choose a color palette
A good palette gives your website, app, or design a consistent identity. Start with one primary color, add supporting colors, and keep a contrasting accent for important actions such as buttons and links.
- Primary color: key brand elements and main actions.
- Supporting colors: related shades for backgrounds, cards, and sections.
- Accent color: use sparingly to highlight important details.
- Neutral colors: whites, greys, or dark tones for readable text.
HEX color codes explained
HEX is a common way to specify colors in CSS. A six-digit code holds the red, green, and blue values. For example, #3B82F6 is a blue. Click a swatch to copy its code and paste it into your stylesheet.
.primary-button {
background-color: #3B82F6;
color: #FFFFFF;
}Before you publish, check text contrast and make sure important information is not shown by color alone.
Color palette FAQs
What is a color palette?
A coordinated group of colors chosen to work together in a design, website, brand, or digital product.
How do I copy a HEX code?
Click or keyboard-focus a swatch. The code is copied to your clipboard when browser permissions allow it.
Can I use these colors in CSS?
Yes. Paste the HEX value into color, background-color, or border-color.
What should I check before using a palette?
Readability, contrast, fit with your brand, and how the colors look on different screens.
How was your experience?
Rate this website