גרדיאנט בין כחול נייבי לבין ירוק

גרדיאנט CSS חלק בין כחול נייבי לבין ירוק, עם ערבוב ב-OKLab כדי שהאמצע יישאר נקי. שנו את הזווית, הוסיפו צבעים והעתיקו את הקוד.

צבעים

מרחב ערבוב

OKLab שומר על אמצע בהיר. sRGB הוא הדרך שבה דפדפנים ישנים מערבבים, ולעיתים קרובות האמצע נעשה אפור.

סוג

זווית90°

CSS

background: linear-gradient(90deg, #000080, #002579, #00386e, #004666, #00535e, #005f52, #006a44, #007530, #008000);
background: linear-gradient(90deg in oklab, #000080, #008000);

Tailwind CSS v4

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

צבעים לאורך הגרדיאנט

צעדים7

הערבוב של כחול נייבי עם ירוק בכל מרחב צבע

אותם שני צבעים נותנים אמצע שונה, תלוי במרחב שבו הדפדפן מערבב. אלה הצבעים המדויקים ב-50%. בערבוב ב-sRGB רגיל האמצע הוא #004040 עם כרומה של 0.057. ב-OKLab מתקבל #00535e עם 0.089, ולכן הגרסה ב-sRGB נראית אפורה יותר באמצע באופן בולט.

מרחב ערבוב	צבע האמצע	בהירות	כרומה
OKLab	#00535e	39.5%	0.089
OKLCH	#00535b	39.5%	0.182
sRGB	#004040	33.6%	0.057
LCH	#004b55	37.1%	0.292
HSL	#008080	54.3%	0.093

שאלות על הגרדיאנט הזה

איך יוצרים ב-CSS גרדיאנט בין כחול נייבי לבין ירוק?

השתמשו ב-background: linear-gradient(90deg in oklab, #000080, #008000). לפני השורה הזו הוסיפו שורה עם גרסת sRGB לדפדפנים ישנים מאוד. אינטרפולציה ב-OKLab עובדת בכל הדפדפנים העדכניים.

איזה צבע נמצא באמצע הדרך בין כחול נייבי לבין ירוק?

בערבוב ב-OKLab, הצבע שבאמצע הדרך בין כחול נייבי לבין ירוק הוא #00535e. ערבוב רגיל ב-sRGB נותן #004040.

איך יוצרים ב-Tailwind CSS גרדיאנט בין כחול נייבי לבין ירוק?

ב-Tailwind CSS v4 השתמשו במחלקות bg-linear-90/oklab from-[#000080] to-[#008000].