色名 · #FBE8C1

Glow Home

Glow Homeは#FBE8C1：rgb(251 232 193)、hsl(40 88% 87%)、oklch(0.937 0.055 85.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Yellow mean? → · Glow Home color name →

#FBE8C1

oklch(0.937 0.055 85.1)

カラー変換

HEX: #fbe8c1
RGB: rgb(251 232 193)
HSL: hsl(40 88% 87%)
HWB: hwb(40 76% 2%)
OKLCH: oklch(0.937 0.055 85.1)
OKLab: oklab(0.937 0.005 0.055)
CIE Lab: lab(92.82 2.3 21.52)
LCH: lch(92.82 21.64 83.9)
CMYK: cmyk(0% 8% 23% 2%)

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

ティント

FBEAC7
FCEDCE
FCEFD4
FDF1DA
FDF4E0
FDF6E6
FEF8ED
FEFAF3
FFFDF9

シェード

DACAA7
BAAC8F
9C9077
7E745F
615949
464034
2D2920
15130E
030302

トーン

EEDDBA
E1D2B4
D5C8AD
C8BDA7
BCB3A0
AFA89A
A39E93
97948D
8C8A86

カラーハーモニー

補色 +180°

FBE8C1
Glow Home
E0EAFF
≈ Husky

類似色 -30° +30°

トライアド +120° +240°

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

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

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

白の上

WCAG 1.20:1 · APCA Lc 10

Fail

黒の上

WCAG 17.41:1 · APCA Lc 94

AAA

最適な文字色: #000000

WCAG 17.41:1 (AAA) · APCA Lc 94

Contrast pairs

コードスニペット

CSS

:root {
  --glow-home: #fbe8c1;
  --glow-home-rgb: 251 232 193;
  --glow-home-oklch: oklch(0.937 0.055 85.1);
}

.element {
  color: var(--glow-home);
  background-color: hsl(40 88% 87%);
  border-color: oklch(0.937 0.055 85.1);
}

Tailwind CSS v4

@theme {
  --color-glow-home: #fbe8c1;
  --color-glow-home-50: #fcf5e4;
  --color-glow-home-100: #f0e7d4;
  --color-glow-home-200: #ded3ba;
  --color-glow-home-300: #c3b698;
  --color-glow-home-400: #ad9c7a;
  --color-glow-home-500: #97845c;
  --color-glow-home-600: #80704e;
  --color-glow-home-700: #66593e;
  --color-glow-home-800: #4c412c;
  --color-glow-home-900: #352d1e;
  --color-glow-home-950: #201a0e;
}

SCSS

$glow-home: #fbe8c1;
$glow-home-rgb: 251, 232, 193;
$glow-home-light: mix(#fff, $glow-home, 20%);
$glow-home-dark: mix(#000, $glow-home, 20%);

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

近い色名

Palettes with similar colors

ツールで開く

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