Mediterranean Villa
Lime-washed walls, terracotta tiles and sea blue shutters.
Color codes
| HEX | RGB | HSL | CMYK | |
|---|---|---|---|---|
| hsl(40, 53%, 93%) | cmyk(0%, 2%, 7%, 3%) | |||
| hsl(36, 54%, 76%) | cmyk(0%, 11%, 29%, 11%) | |||
| hsl(20, 56%, 51%) | cmyk(0%, 47%, 70%, 22%) | |||
| hsl(191, 38%, 39%) | cmyk(55%, 10%, 0%, 46%) | |||
| hsl(193, 41%, 21%) | cmyk(58%, 13%, 0%, 70%) |
CSS
:root {
--mediterranean-villa-1: #F7F1E5;
--mediterranean-villa-2: #E3C9A1;
--mediterranean-villa-3: #C86B3C;
--mediterranean-villa-4: #3E7C8A;
--mediterranean-villa-5: #20434D;
}How these colors work together
It pairs opposite hues on the color wheel for strong, lively contrast. Overall it reads warm. Lightness spans 72 points, which sets how much contrast you can create.
2 of 10 color pairs reach the 4.5:1 contrast needed for normal text. The most readable pair is #F7F1E5 on #20434D (9.47:1).
Mediterranean Villa — readable text using the best pair.
Suggested applications
- Walls, textiles and furniture schemes.
- Interface themes: use the lightest color for backgrounds and the darkest for text.
- Brand kits, social graphics and presentations.
Frequently asked questions
How do I use the Mediterranean Villa palette?
The Mediterranean Villa palette has 5 colors. Use one dominant color for large areas, a supporting color for secondary elements and the most saturated color sparingly as an accent.
Which colors in this palette are best for text?
Use #F7F1E5 on #20434D: it has a contrast ratio of 9.47:1.
Can I download this palette?
Yes. Export it as PNG, SVG, CSS variables, JSON or plain text with the buttons above the color table.
More palettes
Dark Academia Study#1F1B16 #3B2F25 #5A4632 #8A6A46 #C9B28ACoastal Living#FFFFFF #E8F1F2 #A7C7CB #4F7D87 #D9C4A5Japandi#F1EDE6 #D6CBBD #A89A86 #5F574B #2F2C28Watermelon Sorbet#FF595E #FF924C #FDF0D5 #8AC926 #2B9348Lavender Fields#F3EEFC #E0D4F7 #C3B1E1 #9D8EC7 #6A5D8FEco Brand#2D6A4F #40916C #95D5B2 #D8F3DC #081C15