Přejít na výběr barvy

Gradient z „námořnická modrá“ do „korálová“

Plynulý CSS gradient z „námořnická modrá“ do „korálová“, míchaný v OKLab, aby střed zůstal čistý. Změňte úhel, přidejte barvy a zkopírujte kód.

Barvy

Míchat v

OKLab udrží střed jasný. V sRGB míchají barvy staré prohlížeče a střed v něm často zešedne.

Typ
90°

CSS

background: linear-gradient(90deg, #000080, #1a2680, #393a7f, #584a7d, #77577a, #986374, #ba6d6c, #dc7761, #ff7f50);
background: linear-gradient(90deg in oklab, #000080, #ff7f50);

Tailwind CSS v4

bg-linear-90/oklab from-[#000080] to-[#ff7f50]

Barvy podél gradientu

7

Jak se „námořnická modrá“ a „korálová“ míchají v jednotlivých prostorech

Stejné dvě barvy dávají jiný střed podle toho, v jakém prostoru je prohlížeč míchá. Toto jsou přesné barvy v 50 %. Tyto dvě barvy se míchají téměř stejně v každém prostoru: střed je v OKLab #77577a a v sRGB #804068, takže poslouží kterýkoli.

Míchat vNáhled gradientuProstřední barvaSvětlostChroma
OKLab#77577a50,3 %0.067
OKLCH#9a309050,3 %0.178
sRGB#80406846,4 %0.102
LCH#bb006e50,6 %0.231
HSL#e800c863,5 %0.281

Otázky k tomuto gradientu

Jak v CSS vytvořit gradient z „námořnická modrá“ do „korálová“?

Použijte background: linear-gradient(90deg in oklab, #000080, #ff7f50). Pro velmi staré prohlížeče před něj přidejte řádek s verzí v sRGB. Interpolace v OKLab funguje ve všech současných prohlížečích.

Jaká barva leží v polovině mezi „námořnická modrá“ a „korálová“?

Při míchání v OKLab je v polovině mezi „námořnická modrá“ a „korálová“ barva #77577a. Prosté míchání v sRGB dává #804068.

Jak vytvořit gradient z „námořnická modrá“ do „korálová“ v Tailwind CSS?

V Tailwind CSS v4 použijte třídy bg-linear-90/oklab from-[#000080] to-[#ff7f50].