色名 · #ACCFA9
Garden Room
Garden Roomは#ACCFA9：rgb(172 207 169)、hsl(115 28% 74%)、oklch(0.819 0.064 142.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Garden Room color name →
#ACCFA9
oklch(0.819 0.064 142.9)
カラー変換
- HEX
- #accfa9
- RGB
- rgb(172 207 169)
- HSL
- hsl(115 28% 74%)
- HWB
- hwb(115 66% 19%)
- OKLCH
- oklch(0.819 0.064 142.9)
- OKLab
- oklab(0.819 -0.051 0.039)
- CIE Lab
- lab(79.79 -17.47 14.94)
- LCH
- lch(79.79 22.99 139.5)
- CMYK
- cmyk(17% 0% 18% 19%)
ティント · シェード · トーン
ティント
- B4D4B1
- BCD9BA
- C5DDC2
- CDE2CB
- D5E7D4
- DEECDC
- E6F1E5
- EEF5EE
- F7FAF6
シェード
- 95B492
- 7F997C
- 697F67
- 546753
- 404F3F
- 2D382C
- 1B231B
- 0B100A
- 010201
トーン
- A8C7A5
- A3BFA1
- 9FB79D
- 9AAF99
- 96A795
- 929F90
- 8D978C
- 898F88
- 848884
カラーハーモニー
補色 +180°
- ACCFA9
Garden Room
- D8B6DC
≈ Pretty Petunia
類似色 -30° +30°
- ACCFA9
Garden Room
- C3C999
≈ Paris Mint
- 99D2C0
≈ Wintermint
トライアド +120° +240°
- ACCFA9
Garden Room
- AEC4EE
≈ Sky High
- EBB4B0
≈ Naked Rose
スプリットコンプリメンタリー +150° +210°
- ACCFA9
Garden Room
- C5BDEA
≈ Violet Gems
- E6B3C7
≈ Muddy Mauve
テトラード +90° +180° +270°
- ACCFA9
Garden Room
- 9ACCE7
≈ Spring Tide
- D8B6DC
≈ Pretty Petunia
- E6B99D
≈ Seasonal Beige
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.71:1 · APCA Lc 31
Ag
AAA黒の上
WCAG 12.25:1 · APCA Lc 72
最適な文字色: #000000
WCAG 12.25:1 (AAA) · APCA Lc 72
Contrast pairs
コードスニペット
CSS
:root {
--garden-room: #accfa9;
--garden-room-rgb: 172 207 169;
--garden-room-oklch: oklch(0.819 0.064 142.9);
}
.element {
color: var(--garden-room);
background-color: hsl(115 28% 74%);
border-color: oklch(0.819 0.064 142.9);
}Tailwind CSS v4
@theme {
--color-garden-room: #accfa9;
--color-garden-room-50: #eafaea;
--color-garden-room-100: #dbeedb;
--color-garden-room-200: #c4dcc4;
--color-garden-room-300: #a4c1a3;
--color-garden-room-400: #89a986;
--color-garden-room-500: #6d916a;
--color-garden-room-600: #5d7b5a;
--color-garden-room-700: #4a6248;
--color-garden-room-800: #364833;
--color-garden-room-900: #253223;
--color-garden-room-950: #141e12;
}SCSS
$garden-room: #accfa9;
$garden-room-rgb: 172, 207, 169;
$garden-room-light: mix(#fff, $garden-room, 20%);
$garden-room-dark: mix(#000, $garden-room, 20%);
.element {
color: $garden-room;
box-shadow: 0 0 0 2px rgba($garden-room, 0.35);
}