Màu có tên · #FFDDBB

Christmas Rose

Christmas Rose là #FFDDBB: rgb(255 221 187), hsl(30 100% 87%), oklch(0.917 0.059 67). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.

What does Orange mean? → · Christmas Rose color name →

#FFDDBB

oklch(0.917 0.059 67)

Chuyển đổi màu

HEX: #ffddbb
RGB: rgb(255 221 187)
HSL: hsl(30 100% 87%)
HWB: hwb(30 73% 0%)
OKLCH: oklch(0.917 0.059 67)
OKLab: oklab(0.917 0.023 0.054)
CIE Lab: lab(90.37 8.52 21.33)
LCH: lch(90.37 22.97 68.2)
CMYK: cmyk(0% 13% 27% 0%)

Sắc nhạt · Sắc đậm · Sắc xám

Sắc nhạt

FFE0C2
FFE4C9
FFE7D0
FFEBD6
FFEEDD
FFF2E4
FFF5EB
FFF8F1
FFFCF8

Sắc đậm

DEC0A2
BEA48A
9E8873
806E5C
635546
483D32
2E261F
16110D
030202

Sắc xám

F2D3B5
E5CAAF
D7C0A9
CBB7A3
BEAE9D
B1A498
A59B92
98928C
8C8986

Hòa sắc

Bổ túc +180°

FFDDBB
Christmas Rose
CEE7FF
≈ Veiling Waterfalls

Tương đồng -30° +30°

Bộ ba +120° +240°

Bổ túc chia +150° +210°

Bộ bốn +90° +180° +270°

Tương phản và khả năng tiếp cận

Trên nền trắng

WCAG 1.28:1 · APCA Lc 14

Fail

Trên nền đen

WCAG 16.31:1 · APCA Lc 90

AAA

Màu chữ tốt nhất: #000000

WCAG 16.31:1 (AAA) · APCA Lc 90

Contrast pairs

Đoạn mã

CSS

:root {
  --christmas-rose: #ffddbb;
  --christmas-rose-rgb: 255 221 187;
  --christmas-rose-oklch: oklch(0.917 0.059 67);
}

.element {
  color: var(--christmas-rose);
  background-color: hsl(30 100% 87%);
  border-color: oklch(0.917 0.059 67);
}

Tailwind CSS v4

@theme {
  --color-christmas-rose: #ffddbb;
  --color-christmas-rose-50: #fff3e4;
  --color-christmas-rose-100: #f5e5d4;
  --color-christmas-rose-200: #e5d0ba;
  --color-christmas-rose-300: #ccb398;
  --color-christmas-rose-400: #b6987a;
  --color-christmas-rose-500: #a17f5c;
  --color-christmas-rose-600: #886b4e;
  --color-christmas-rose-700: #6d563e;
  --color-christmas-rose-800: #513e2d;
  --color-christmas-rose-900: #382b1e;
  --color-christmas-rose-950: #23180e;
}

SCSS

$christmas-rose: #ffddbb;
$christmas-rose-rgb: 255, 221, 187;
$christmas-rose-light: mix(#fff, $christmas-rose, 20%);
$christmas-rose-dark: mix(#000, $christmas-rose, 20%);

.element {
  color: $christmas-rose;
  box-shadow: 0 0 0 2px rgba($christmas-rose, 0.35);
}

Các màu có tên tương tự

Palettes with similar colors

Mở trong công cụ

Bộ chọn Cặp màu Kiểm tra tương phản Studio JSON API