色名 · #FFECE9

Rose Frost

Rose Frostは#FFECE9：rgb(255 236 233)、hsl(8 100% 96%)、oklch(0.957 0.021 28.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Gray mean? → · Rose Frost color name →

#FFECE9

oklch(0.957 0.021 28.3)

カラー変換

HEX: #ffece9
RGB: rgb(255 236 233)
HSL: hsl(8 100% 96%)
HWB: hwb(8 91% 0%)
OKLCH: oklch(0.957 0.021 28.3)
OKLab: oklab(0.957 0.019 0.01)
CIE Lab: lab(94.87 6.29 3.9)
LCH: lch(94.87 7.4 31.8)
CMYK: cmyk(0% 7% 9% 0%)

ティント · シェード · トーン

ティント

FFEEEB
FFF0ED
FFF2F0
FFF4F2
FFF5F4
FFF7F6
FFF9F8
FFFBFB
FFFDFD

シェード

DECDCB
BEAFAD
9E9290
807674
635B5A
484241
2E2929
161313
030303

トーン

F2E1DE
E4D5D3
D7CAC8
CABFBE
BEB5B3
B1AAA9
A49F9E
989594
8C8A8A

カラーハーモニー

補色 +180°

FFECE9
Rose Frost
E2F5F8
≈ Coastal Breeze

類似色 -30° +30°

トライアド +120° +240°

スプリットコンプリメンタリー +150° +210°

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 1.13:1 · APCA Lc 0

Fail

黒の上

WCAG 18.42:1 · APCA Lc 98

AAA

最適な文字色: #000000

WCAG 18.42:1 (AAA) · APCA Lc 98

Contrast pairs

コードスニペット

CSS

:root {
  --rose-frost: #ffece9;
  --rose-frost-rgb: 255 236 233;
  --rose-frost-oklch: oklch(0.957 0.021 28.3);
}

.element {
  color: var(--rose-frost);
  background-color: hsl(8 100% 96%);
  border-color: oklch(0.957 0.021 28.3);
}

Tailwind CSS v4

@theme {
  --color-rose-frost: #ffece9;
  --color-rose-frost-50: #fbf3f1;
  --color-rose-frost-100: #efe5e4;
  --color-rose-frost-200: #ddd1cf;
  --color-rose-frost-300: #c2b4b1;
  --color-rose-frost-400: #ab9a97;
  --color-rose-frost-500: #94817e;
  --color-rose-frost-600: #7d6d6b;
  --color-rose-frost-700: #645755;
  --color-rose-frost-800: #49403e;
  --color-rose-frost-900: #332c2b;
  --color-rose-frost-950: #1f1918;
}

SCSS

$rose-frost: #ffece9;
$rose-frost-rgb: 255, 236, 233;
$rose-frost-light: mix(#fff, $rose-frost, 20%);
$rose-frost-dark: mix(#000, $rose-frost, 20%);

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

近い色名

Palettes with similar colors

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API