Pikka Logo Pikka
Chrome App
Edge Color Inspector RGB: rgb(203, 195, 227) HSL: 255°, 36%, 83%

#CBC3E3 Color Code — Hex, RGB, HSL & Palettes

Technical color specifications and conversion tokens for #CBC3E3. Explore exact conversions across RGB, HSL, HSV, CMYK, Apple Display P3, WCAG 2.1 accessibility ratings, and ready-to-copy code exports.

Click to Copy HEX
#CBC3E3
rgb(203, 195, 227)
Open in Color Wheel Generate 11 Scales Add Opacity (RGBA) Edit in Web Studio
HEX
#CBC3E3
RGB
rgb(203, 195, 227)
HSL
hsl(255, 36%, 83%)
HSV / HSB
hsb(255, 14%, 89%)
CMYK (Print)
cmyk(11%, 14%, 0%, 11%)
Apple Display P3
color(display-p3 0.796 0.765 0.890)

WCAG 2.1 Accessibility & Contrast Rating

Evaluates readability of text rendered on top of #CBC3E3 in compliance with Web Content Accessibility Guidelines (WCAG 2.1).

White Text (#FFFFFF) 1.69:1 (Fail)
Black Text (#000000) 12.45:1 (AAA Pass)

11-Step Tints & Shades Scale (Tailwind 50–950)

Mathematically balanced luminance scale for design systems, CSS variables, and Tailwind theme tokens. Click any shade to copy hex code:

50
#FBFAFD
100
#F5F3F9
200
#EBE8F4
300
#E1DCEF
400
#D5CFE9
500
#CBC3E3
600
#A6A0BA
700
#827D91
800
#5D5A68
900
#393740
950
#1C1B20

Color Harmonies & Palettes

Calculated geometric harmonies based on standard 360° color wheel rotation for #CBC3E3:

Complementary (180°)

#DBE3C4
High-contrast opposite on color wheel

Analogous (-30°)

#C4CCE3
Harmonious adjacent shade

Analogous (+30°)

#DBC4E3
Harmonious adjacent shade

Triadic (+120°)

#E3CCC4
Vibrant 3-point harmony

Triadic (+240°)

#C4E3CC
Vibrant 3-point harmony

Split Comp (+150°)

#E3DBC4
Balanced high contrast

Live UI Component Preview

See how #CBC3E3 behaves as a primary accent, interactive button, and card border in dark mode interfaces:

BUTTONS & ACTIONS
BADGES & CHIPS
Active Status Filter Tag
Alert banner styled with #CBC3E3 accent border.
SURFACE CARD

Theme Token Card

Card container featuring a top accent strip rendered in #CBC3E3.

Copy-Paste Code Exports

Ready-to-use color declarations for popular web and mobile development frameworks:

Tailwind CSS v4 (@theme) 
@theme {
  --color-brand: #CBC3E3;
}
CSS Variables (:root) 
:root {
  --primary: #CBC3E3;
  --primary-foreground: #000000;
}
SwiftUI (iOS & macOS) 
Color(red: 0.796, green: 0.765, blue: 0.890)
Flutter Dart 
const Color(0xFFCBC3E3)

Explore More Professional Color Tools on Pikka

Convert opacity with RGBA to HEX, build harmonious color palettes on the interactive canvas, or sample colors straight from your screen with Pikka for Chrome & Mac.

Open Color Wheel RGBA to HEX Converter Tint & Shade Generator Chrome Extension