0

CSS gradientu ģenerators

Veidojiet CSS gradientus vizuāli: lineārs, radiāls vai konisks veids, leņķa slīdnis un līdz pat sešām krāsu pieturām ar dzīvu pilna platuma priekšskatījumu un kopējamu kodu.

90°
Notiek apstrāde... 0%

Rezultāts

Lineārā gradienta (135grādi, #2193b0 0%, #6dd5ed 100%) rakstīšana ar roku un lapas atkārtota ielāde, lai to redzētu, ir lēna cilpa. Šis ģenerators to aizver: izvēlieties lineāru, radiālu vai konisku, velciet leņķa slīdni, iestatiet katru krāsu pieturu, izmantojot sākotnējo krāsu atlasītāju un procentuālo pozīciju — un pilna platuma priekšskatījums tiek pārkrāsots uz katru ievadi, un gatavā fona līnija vienmēr ir gatava kopēšanai.

Trīs gradientu veidi aptver dažādus darbus. Lineārie gradienti izzūd noteiktā virzienā un satur lielāko daļu varoņu sadaļu un pogu; radiālie gradienti izstaro no centra spīdumiem un vinjetēm; konusveida gradienti slauka ap centru un jaudas sektoru diagrammas un krāsu riteņus. Jebkurā brīdī varat mainīt veidus — jūsu pieturas tiek pārnestas, tāpēc trīs salīdzināšana aizņem sekundes.

Līdz pat sešām krāsu pieturām ir vieta vairāku joslu dizainam, un iepriekš iestatītajās lapās tiek piedāvātas pārbaudītas kombinācijas — silts saulriets, mierīgs okeāns un maigs pasteļtoņu pāris — kā sākumpunktus, kurus varat pielāgot, nevis tukšus audeklus. Ņemiet vērā darba dalīšanu: krāsu paletes ģenerators šajā vietnē izvēlas harmoniskas plakanas krāsas, un krāsu formāta pārveidotājs pārveido vērtību starp HEX, RGB un HSL, savukārt šis rīks veic citu uzdevumu — tas pārvērš izvēlētās krāsas gatavā CSS gradienta kodā.

Viss darbojas lokāli jūsu pārlūkprogrammā: nav augšupielādes, nav konta, nav servera maršruta turp un atpakaļ, un ģenerators turpina darboties bezsaistē pēc ielādes.