CSS Qradiyent Generatoru

Rəng nöqtələri

Nöqtə əlavə etmək üçün zolağa klikləyin, nöqtəni yerini dəyişmək üçün sürüşdürün. Nöqtə seçiləndə ox düymələri onu hərəkət etdirir, Delete isə silir.

Rəng qarışdırma fəzası

Eyni nöqtələr, üç fərqli üsulla qarışdırılıb. Klassik sRGB bir-birindən uzaq rənglər arasında bozara və ya bulanıqlaşa bilər; OKLab parlaqlığı bərabər saxlayır, OKLCH isə rəngi doyğun saxlayır. OKLab və ya OKLCH-ni tanımayan brauzerlər eyni görünən sRGB ehtiyat variantını alır.

Üstdəki mətn

Ağ mətn

2.1:1

Çox aşağı

Qara mətn

4.2:1

AA yalnız iri mətn üçün

Qradiyentin istənilən yerindəki ən aşağı kontrast. WCAG AA əsas mətn üçün 4.5:1, iri mətn üçün isə 3:1 tələb edir.

Kod

background: linear-gradient(90deg, #0077a3 0%, #1178a2 1.56%, #1b79a1 3.13%, #2a7b9f 6.25%, #367d9c 9.38%, #3f7f9a 12.5%, #608591 25%, #959179 50%, #ad956b 62.5%, #c59959 75%, #dd9c41 87.5%, #e99d2f 93.75%, #ef9d22 96.88%, #f29e19 98.44%, #f59e0b 100%);
background: linear-gradient(in oklab 90deg, #0077a3 0%, #f59e0b 100%);