色名 · #C0A98E
3AM Latte
3AM Latteは#C0A98E：rgb(192 169 142)、hsl(32 28% 65%)、oklch(0.748 0.046 71.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · 3AM Latte color name →
#C0A98E
oklch(0.748 0.046 71.5)
カラー変換
- HEX
- #c0a98e
- RGB
- rgb(192 169 142)
- HSL
- hsl(32 28% 65%)
- HWB
- hwb(32 56% 25%)
- OKLCH
- oklch(0.748 0.046 71.5)
- OKLab
- oklab(0.748 0.015 0.044)
- CIE Lab
- lab(70.74 5.54 17.22)
- LCH
- lch(70.74 18.09 72.2)
- CMYK
- cmyk(0% 12% 26% 25%)
ティント · シェード · トーン
ティント
- C6B199
- CCBAA4
- D3C2AF
- D9CBBA
- DFD3C6
- E6DCD1
- ECE5DC
- F2EDE8
- F9F6F3
シェード
- A7927B
- 8E7C68
- 766756
- 5F5344
- 493F34
- 342C24
- 201B15
- 0E0A07
- 020101
トーン
- B9A58D
- B3A18B
- AC9D8A
- A69889
- A09487
- 999086
- 938C85
- 8D8883
- 868482
カラーハーモニー
補色 +180°
- C0A98E
3AM Latte
- 99B0CA
≈ Porcelain Vase
類似色 -30° +30°
- C0A98E
3AM Latte
- C8A497
≈ Naked Clay
- B3AF8D
≈ That’s Atomic
トライアド +120° +240°
- C0A98E
3AM Latte
- 8CB7B4
≈ Vintage Blue
- B7A5C3
≈ Pixieland
スプリットコンプリメンタリー +150° +210°
- C0A98E
3AM Latte
- 8EB4C2
≈ Bright Bluebonnet
- A8AACA
≈ Wisteria Light Soft Blue
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.25:1 · APCA Lc 44
Ag
AAA黒の上
WCAG 9.30:1 · APCA Lc 58
最適な文字色: #000000
WCAG 9.30:1 (AAA) · APCA Lc 58
Contrast pairs
コードスニペット
CSS
:root {
--color-3am-latte: #c0a98e;
--color-3am-latte-rgb: 192 169 142;
--color-3am-latte-oklch: oklch(0.748 0.046 71.5);
}
.element {
color: var(--color-3am-latte);
background-color: hsl(32 28% 65%);
border-color: oklch(0.748 0.046 71.5);
}Tailwind CSS v4
@theme {
--color-color-3am-latte: #c0a98e;
--color-color-3am-latte-50: #fdf3e7;
--color-color-3am-latte-100: #f1e6d8;
--color-color-3am-latte-200: #e1d2bf;
--color-color-3am-latte-300: #c6b49e;
--color-color-3am-latte-400: #b09a81;
--color-color-3am-latte-500: #9a8265;
--color-color-3am-latte-600: #826e56;
--color-color-3am-latte-700: #685844;
--color-color-3am-latte-800: #4d4031;
--color-color-3am-latte-900: #352c21;
--color-color-3am-latte-950: #211911;
}SCSS
$color-3am-latte: #c0a98e;
$color-3am-latte-rgb: 192, 169, 142;
$color-3am-latte-light: mix(#fff, $color-3am-latte, 20%);
$color-3am-latte-dark: mix(#000, $color-3am-latte, 20%);
.element {
color: $color-3am-latte;
box-shadow: 0 0 0 2px rgba($color-3am-latte, 0.35);
}