色名 · #BAA243
Sea Squash
Sea Squashは#BAA243:rgb(186 162 67)、hsl(48 47% 50%)、oklch(0.715 0.117 95)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Sea Squash color name →
#BAA243
oklch(0.715 0.117 95)
カラー変換
- HEX
- #baa243
- RGB
- rgb(186 162 67)
- HSL
- hsl(48 47% 50%)
- HWB
- hwb(48 26% 27%)
- OKLCH
- oklch(0.715 0.117 95)
- OKLab
- oklab(0.715 -0.01 0.117)
- CIE Lab
- lab(67.4 0.97 51.16)
- LCH
- lch(67.4 51.17 88.9)
- CMYK
- cmyk(0% 13% 64% 27%)
ティント · シェード · トーン
ティント
- C1AB59
- C7B56D
- CEBE80
- D5C793
- DCD0A5
- E3DAB7
- EAE3C9
- F1ECDB
- F8F6ED
シェード
- A18C39
- 89772F
- 726326
- 5C4F1D
- 463C14
- 322A0C
- 1E1905
- 0D0A01
- 020100
トーン
- B49F4D
- AE9C55
- A8985C
- A29562
- 9C9268
- 978E6E
- 918B73
- 8B8777
- 86847C
カラーハーモニー
補色 +180°
- BAA243
Sea Squash
- 8E9DEC
≈ Cold Lips
類似色 -30° +30°
- BAA243
Sea Squash
- D5934E
≈ Salt Caramel
- 92B05B
≈ Asparagus Cream
トライアド +120° +240°
- BAA243
Sea Squash
- 2BB5D1
≈ Ocean Sigh
- D086C0
≈ Cyclamen
スプリットコンプリメンタリー +150° +210°
- BAA243
Sea Squash
- 5FAAE7
≈ Blue Jeans
- B490DE
≈ Dreamy Candy Forest
テトラード +90° +180° +270°
- BAA243
Sea Squash
- 2BBBAD
≈ Turquoise Topaz
- 8E9DEC
≈ Cold Lips
- E08399
≈ Rose Soiree
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.51:1 · APCA Lc 49
Ag
AAA黒の上
WCAG 8.33:1 · APCA Lc 53
最適な文字色: #000000
WCAG 8.33:1 (AAA) · APCA Lc 53
Contrast pairs
コードスニペット
CSS
:root {
--sea-squash: #baa243;
--sea-squash-rgb: 186 162 67;
--sea-squash-oklch: oklch(0.715 0.117 95);
}
.element {
color: var(--sea-squash);
background-color: hsl(48 47% 50%);
border-color: oklch(0.715 0.117 95);
}Tailwind CSS v4
@theme {
--color-sea-squash: #baa243;
--color-sea-squash-50: #fef6d0;
--color-sea-squash-100: #f3e9bc;
--color-sea-squash-200: #e2d59b;
--color-sea-squash-300: #c8b870;
--color-sea-squash-400: #b49d45;
--color-sea-squash-500: #9f8400;
--color-sea-squash-600: #867005;
--color-sea-squash-700: #6b5a07;
--color-sea-squash-800: #504103;
--color-sea-squash-900: #382d03;
--color-sea-squash-950: #231a00;
}SCSS
$sea-squash: #baa243;
$sea-squash-rgb: 186, 162, 67;
$sea-squash-light: mix(#fff, $sea-squash, 20%);
$sea-squash-dark: mix(#000, $sea-squash, 20%);
.element {
color: $sea-squash;
box-shadow: 0 0 0 2px rgba($sea-squash, 0.35);
}