色名 · #DDCCAC
Peaceable Kingdom
Peaceable Kingdomは#DDCCAC：rgb(221 204 172)、hsl(39 42% 77%)、oklch(0.851 0.047 83.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Peaceable Kingdom color name →
#DDCCAC
oklch(0.851 0.047 83.3)
カラー変換
- HEX
- #ddccac
- RGB
- rgb(221 204 172)
- HSL
- hsl(39 42% 77%)
- HWB
- hwb(39 67% 13%)
- OKLCH
- oklch(0.851 0.047 83.3)
- OKLab
- oklab(0.851 0.005 0.046)
- CIE Lab
- lab(82.85 2.42 18.28)
- LCH
- lch(82.85 18.43 82.5)
- CMYK
- cmyk(0% 8% 22% 13%)
ティント · シェード · トーン
ティント
- E0D1B4
- E4D6BC
- E7DBC5
- EBE0CD
- EEE5D5
- F1EADE
- F5F0E6
- F8F5EE
- FCFAF7
シェード
- C0B195
- A4977F
- 887E69
- 6E6554
- 554E40
- 3D372D
- 26221B
- 110F0B
- 020201
トーン
- D3C4A8
- CABCA3
- C0B59F
- B7AD9A
- ADA596
- A49E92
- 9B968D
- 928F89
- 898784
カラーハーモニー
補色 +180°
- DDCCAC
Peaceable Kingdom
- BECFEE
≈ Frost Fairy
類似色 -30° +30°
- DDCCAC
Peaceable Kingdom
- E8C6B2
≈ Pinkham
- CED2AF
≈ Olive Martini
トライアド +120° +240°
- DDCCAC
Peaceable Kingdom
- ABD8DC
≈ Crystal
- DEC4E0
≈ Simply Lavender
スプリットコンプリメンタリー +150° +210°
- DDCCAC
Peaceable Kingdom
- B1D4E8
≈ Chapel Blue
- CFC9EB
≈ Italian Fitch
テトラード +90° +180° +270°
- DDCCAC
Peaceable Kingdom
- B0D9CB
≈ Scud
- BECFEE
≈ Frost Fairy
- E8C2D0
≈ Misty Memories
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.57:1 · APCA Lc 26
Ag
AAA黒の上
WCAG 13.30:1 · APCA Lc 77
最適な文字色: #000000
WCAG 13.30:1 (AAA) · APCA Lc 77
Contrast pairs
コードスニペット
CSS
:root {
--peaceable-kingdom: #ddccac;
--peaceable-kingdom-rgb: 221 204 172;
--peaceable-kingdom-oklch: oklch(0.851 0.047 83.3);
}
.element {
color: var(--peaceable-kingdom);
background-color: hsl(39 42% 77%);
border-color: oklch(0.851 0.047 83.3);
}Tailwind CSS v4
@theme {
--color-peaceable-kingdom: #ddccac;
--color-peaceable-kingdom-50: #fbf4e6;
--color-peaceable-kingdom-100: #efe7d7;
--color-peaceable-kingdom-200: #ddd3be;
--color-peaceable-kingdom-300: #c2b69d;
--color-peaceable-kingdom-400: #ac9c7f;
--color-peaceable-kingdom-500: #958463;
--color-peaceable-kingdom-600: #7e7054;
--color-peaceable-kingdom-700: #655943;
--color-peaceable-kingdom-800: #4b4130;
--color-peaceable-kingdom-900: #342d20;
--color-peaceable-kingdom-950: #1f1a10;
}SCSS
$peaceable-kingdom: #ddccac;
$peaceable-kingdom-rgb: 221, 204, 172;
$peaceable-kingdom-light: mix(#fff, $peaceable-kingdom, 20%);
$peaceable-kingdom-dark: mix(#000, $peaceable-kingdom, 20%);
.element {
color: $peaceable-kingdom;
box-shadow: 0 0 0 2px rgba($peaceable-kingdom, 0.35);
}