رفتن به انتخابگر رنگ

گرادیان آبی به قرمز

گرادیان نرم آبی به قرمز در CSS، ترکیب‌شده در OKLab تا وسطش تمیز بماند. زاویه را عوض کنید، رنگ اضافه کنید و کد را کپی کنید.

رنگ‌ها

فضای ترکیب

OKLab وسط را روشن نگه می‌دارد. sRGB روش ترکیب مرورگرهای قدیمی است و اغلب وسط را خاکستری می‌کند.

نوع
۹۰°

CSS

background: linear-gradient(90deg, #0000ff, #3036e8, #5147d2, #6f50ba, #8c53a2, #a95189, #c6496d, #e2384b, #ff0000);
background: linear-gradient(90deg in oklab, #0000ff, #ff0000);

Tailwind CSS v4

bg-linear-90/oklab from-[#0000ff] to-[#ff0000]

رنگ‌ها در طول گرادیان

7

آبی و قرمز در هر فضای رنگی چطور ترکیب می‌شوند

همین دو رنگ بسته به فضایی که مرورگر در آن ترکیب می‌کند، وسط متفاوتی می‌دهند. این‌ها رنگ‌های دقیق در 50% هستند. این دو رنگ تقریباً در همهٔ فضاها یکسان ترکیب می‌شوند: وسط در OKLab برابر #8c53a2 و در sRGB برابر #800080 است، پس هر کدام را انتخاب کنید جواب می‌دهد.

فضای ترکیبپیش‌نمایش گرادیانرنگ وسطروشناییکروما
OKLab#8c53a2۵۴٪0.134
OKLCH#b700be۵۴٪0.285
sRGB#800080۴۲٪0.193
LCH#cd007e۵۴٫۴٪0.384
HSL#ff00ff۷۰٫۲٪0.322

پرسش‌ها دربارهٔ این گرادیان

چطور گرادیان آبی به قرمز را در CSS بسازم؟

از background: linear-gradient(90deg in oklab, #0000ff, #ff0000) استفاده کنید. برای مرورگرهای خیلی قدیمی، یک خط با نسخهٔ sRGB پیش از آن اضافه کنید. درون‌یابی در OKLab در همهٔ مرورگرهای فعلی کار می‌کند.

رنگ وسط آبی و قرمز چیست؟

در ترکیب با OKLab، رنگ وسط آبی و قرمز برابر #8c53a2 است. ترکیب ساده در sRGB رنگ #800080 را می‌دهد.

چطور گرادیان آبی به قرمز را در Tailwind CSS بسازم؟

در Tailwind CSS v4 از کلاس‌های bg-linear-90/oklab from-[#0000ff] to-[#ff0000] استفاده کنید.