色名 · #B7FFFA
Winter Meadow
Winter Meadowは#B7FFFA：rgb(183 255 250)、hsl(176 100% 86%)、oklch(0.951 0.071 190.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Teal mean? → · Winter Meadow color name →
#B7FFFA
oklch(0.951 0.071 190.6)
カラー変換
- HEX
- #b7fffa
- RGB
- rgb(183 255 250)
- HSL
- hsl(176 100% 86%)
- HWB
- hwb(176 72% 0%)
- OKLCH
- oklch(0.951 0.071 190.6)
- OKLab
- oklab(0.951 -0.07 -0.013)
- CIE Lab
- lab(95.17 -23.81 -5.15)
- LCH
- lch(95.17 24.36 192.2)
- CMYK
- cmyk(28% 0% 2% 0%)
ティント · シェード · トーン
ティント
- BFFFFB
- C7FFFB
- CEFFFC
- D6FFFC
- DDFFFD
- E4FFFD
- EBFFFE
- F2FFFE
- F8FFFF
シェード
- 9FDED9
- 87BEBA
- 709E9B
- 5A807D
- 456361
- 314846
- 1E2E2D
- 0C1615
- 020303
トーン
- B2F2ED
- ADE4E0
- A8D7D4
- A2CBC7
- 9DBEBB
- 97B1AF
- 92A5A3
- 8C9897
- 868C8B
カラーハーモニー
補色 +180°
- B7FFFA
Winter Meadow
- FFE9EB
≈ Pink Sparkle
類似色 -30° +30°
- B7FFFA
Winter Meadow
- C6FFDF
≈ Mint Zest
- D7F5FF
≈ Glacial Day
トライアド +120° +240°
- B7FFFA
Winter Meadow
- F6EAFF
≈ Placebo Fuchsia
- FFEBD6
≈ Winter Morning
スプリットコンプリメンタリー +150° +210°
- B7FFFA
Winter Meadow
- FFE7F6
≈ Dolomite Crystal
- FFEAE2
≈ Translucent Silk
テトラード +90° +180° +270°
- B7FFFA
Winter Meadow
- ECEEFF
≈ Carte Blanche
- FFE9EB
≈ Pink Sparkle
- F9F1BA
≈ Solar Glow
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.12:1 · APCA Lc 0
Ag
AAA黒の上
WCAG 18.69:1 · APCA Lc 99
最適な文字色: #000000
WCAG 18.69:1 (AAA) · APCA Lc 99
Contrast pairs
コードスニペット
CSS
:root {
--winter-meadow: #b7fffa;
--winter-meadow-rgb: 183 255 250;
--winter-meadow-oklch: oklch(0.951 0.071 190.6);
}
.element {
color: var(--winter-meadow);
background-color: hsl(176 100% 86%);
border-color: oklch(0.951 0.071 190.6);
}Tailwind CSS v4
@theme {
--color-winter-meadow: #b7fffa;
--color-winter-meadow-50: #dffcfa;
--color-winter-meadow-100: #cef0ee;
--color-winter-meadow-200: #b2dedc;
--color-winter-meadow-300: #8dc3c1;
--color-winter-meadow-400: #6aaca8;
--color-winter-meadow-500: #469591;
--color-winter-meadow-600: #3c7e7b;
--color-winter-meadow-700: #306562;
--color-winter-meadow-800: #224a47;
--color-winter-meadow-900: #163431;
--color-winter-meadow-950: #071f1d;
}SCSS
$winter-meadow: #b7fffa;
$winter-meadow-rgb: 183, 255, 250;
$winter-meadow-light: mix(#fff, $winter-meadow, 20%);
$winter-meadow-dark: mix(#000, $winter-meadow, 20%);
.element {
color: $winter-meadow;
box-shadow: 0 0 0 2px rgba($winter-meadow, 0.35);
}