色名 · #A892A8
Garden Flower
Garden Flowerは#A892A8：rgb(168 146 168)、hsl(300 11% 62%)、oklch(0.687 0.041 326)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Purple mean? → · Garden Flower color name →
#A892A8
oklch(0.687 0.041 326)
カラー変換
- HEX
- #a892a8
- RGB
- rgb(168 146 168)
- HSL
- hsl(300 11% 62%)
- HWB
- hwb(300 57% 34%)
- OKLCH
- oklch(0.687 0.041 326)
- OKLab
- oklab(0.687 0.034 -0.023)
- CIE Lab
- lab(63.09 11.46 -8.42)
- LCH
- lch(63.09 14.22 323.7)
- CMYK
- cmyk(0% 13% 0% 34%)
ティント · シェード · トーン
ティント
- B09CB0
- B9A7B9
- C2B2C1
- CABCCA
- D3C7D3
- DCD2DC
- E4DDE4
- EDE8ED
- F6F4F6
シェード
- 927E92
- 7C6B7C
- 675867
- 524652
- 3F353F
- 2C252C
- 1A161A
- 0A080A
- 010101
トーン
- A490A4
- A08EA0
- 9C8D9C
- 988B98
- 948994
- 908790
- 8C858C
- 888488
- 848284
カラーハーモニー
補色 +180°
- A892A8
Garden Flower
- 8BA18C
≈ Hillside View
類似色 -30° +30°
- A892A8
Garden Flower
- 9C96B1
≈ Heirloom Lilac
- B0909B
≈ Mauve Shadows
トライアド +120° +240°
- A892A8
Garden Flower
- A6997E
≈ Harvest Dance
- 7DA2A7
≈ Tourmaline
スプリットコンプリメンタリー +150° +210°
- A892A8
Garden Flower
- 999E82
≈ Fennelly
- 80A399
≈ Gnome
テトラード +90° +180° +270°
- A892A8
Garden Flower
- AF9483
≈ Sandrift
- 8BA18C
≈ Hillside View
- 839FB0
≈ Lake Okoboji
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.86:1 · APCA Lc 55
Ag
AAA黒の上
WCAG 7.34:1 · APCA Lc 47
最適な文字色: #000000
WCAG 7.34:1 (AAA) · APCA Lc 47
Contrast pairs
コードスニペット
CSS
:root {
--garden-flower: #a892a8;
--garden-flower-rgb: 168 146 168;
--garden-flower-oklch: oklch(0.687 0.041 326);
}
.element {
color: var(--garden-flower);
background-color: hsl(300 11% 62%);
border-color: oklch(0.687 0.041 326);
}Tailwind CSS v4
@theme {
--color-garden-flower: #a892a8;
--color-garden-flower-50: #fcf1fb;
--color-garden-flower-100: #f0e3ef;
--color-garden-flower-200: #decedd;
--color-garden-flower-300: #c3b0c2;
--color-garden-flower-400: #ac97ac;
--color-garden-flower-500: #957d95;
--color-garden-flower-600: #7e6a7e;
--color-garden-flower-700: #655565;
--color-garden-flower-800: #4a3e4a;
--color-garden-flower-900: #332a34;
--color-garden-flower-950: #1f181f;
}SCSS
$garden-flower: #a892a8;
$garden-flower-rgb: 168, 146, 168;
$garden-flower-light: mix(#fff, $garden-flower, 20%);
$garden-flower-dark: mix(#000, $garden-flower, 20%);
.element {
color: $garden-flower;
box-shadow: 0 0 0 2px rgba($garden-flower, 0.35);
}