Dreamy Soft Lavender Blue
Category: Purple
Periwinkle (#CCCCFF) — Color Codes, Meaning & UI Palettes
Periwinkle is a serene pastel named after the myrtle flower. Balancing soft blue and faint violet, it evokes gentle nostalgia, imagination, and calm introspection.
Click to Copy HEX
Periwinkle
#CCCCFF
HEX
#CCCCFF
RGB
rgb(204, 204, 255)
HSL
hsl(240deg, 100%, 90%)
CMYK (Print)
cmyk(20%, 20%, 0%, 0%)
Apple Display P3
color(display-p3 0.800 0.800 1.000)
WCAG 2.1 Accessibility & Contrast Rating
White Text (#FFFFFF)
1.54:1 (Fail)
Black Text (#000000)
13.65:1 (AAA)
11-Step Tints & Shades Scale (Tailwind 50–950)
Mathematically balanced luminance scale for design tokens and CSS color palettes. Click any shade to copy hex code:
50
#FCFCFF
100
#F7F7FF
200
#EFEFFF
300
#E4E4FF
400
#D8D8FF
500
#CCCCFF
600
#A3A3CC
700
#7A7A99
800
#525266
900
#2D2D38
950
#18181F
Color Harmonies & Palette Schemes
Complementary
#FFFFCC
Opposite 180° Contrast
Analogous -30°
#CCE5FF
Natural Harmony
Analogous +30°
#E5CCFF
Natural Harmony
Triadic +120°
#FFCCCC
120° Balanced Triad
Triadic +240°
#CCFFCC
120° Balanced Triad
Curated UI Design Pairings for Periwinkle
Popular in mindfulness applications, sleep tracking dashboards, and Gen-Z creative portfolios. Use deep navy for text to satisfy WCAG AA.
Deep Oceanic Navy
#0A192F
High-Contrast Text
Frosted Lilac
#FDFBFF
Soft Surface Tint
Electric Cyan
#06B6D4
Analogous Energy Accent
Muted Slate
#64748B
Secondary Card Border
Export Periwinkle Code Snippets
CSS Variable
--color-periwinkle-color: #CCCCFF;
Tailwind Config
'periwinkle-color': '#CCCCFF'
Swift / SwiftUI
Color(hex: "#CCCCFF")
JSON Design Token
{"name": "Periwinkle", "hex": "#CCCCFF"}
Explore More Colors in the Dictionary
Browse our complete catalog of curated named colors, harmonic palettes, and accessible UI combinations.