Preskoči na vsebino
100% lokalno

Ekstraktor barv CSS spremenljivk

Poiščite vsako barvo v CSS-u in jo pretvorite v ponovno uporabne lastnosti.

Vhod
0
Izhod

Ekstraktor barv CSS spremenljivk

Prilepite slog in to orodje skenira vsako deklaracijo za vrednosti barv, napisane kot hex, rgb()/rgba() ali hsl()/hsla(), nato pa znova napiše pravila, da se nanašajo na lastnosti namesto ponavljanja iste vrednosti povsod. Ustvarjeno je za čiščenje slogov, ki so rasli organsko — redizajn, združevanje knjižnice komponent ali CSS izvlečen iz orodja za oblikovanje — kjer ista modra barva končuje tipizirana na ducat malo drugačnih načinov.

Mogućnost poimenovanja nadzira, kako se vsaka spremenljivka imenuje: po vrstnem redu prve pojave (--color-1, --color-2…), po približnem odtenku in svetlosti (--color-dark-blue, --color-light-gray), ali po lastnosti, v kateri se prvič pojavi (--color-background, --color-border). Vključite "združi enake barve, napisane drugače" da združite #ff0000, rgb(255, 0, 0) in hsl(0, 100%, 50%) v eno spremenljivko, čeprav se izvirno besedilo razlikuje; enake vrednosti se vedno združijo ne glede na to. Drsnik podobnosti gre naprej in združuje odtenke, ki so blizu, vendar ne enaki — koristno, če se paleta nabrala bliskih duplikatov sivih ali modrih barv, ki jih nihče ni namenoma ustvaril. Izberite, ali generirani blok sedi pod :root ali prilagojenim selektor, izberite zapis, v katerem se spremenljivke natisnejo, ali se prebacite na enostavni seznam barv in števila pojavkov, ko želite le revizijo namesto prepisovanja.

Skener gleda samo v dejanskih vrednostih deklaracij, tako da nikoli ne zmotiti selektorja ID, kot je #abcabc, za barvo, in pusti komentarje, navedene nize in vsebino url() popolnoma nedotaknjene. Končavanja vrstic Windows in Unix oba delujeta, in orodje ni zavajano s funkcijami, gnezdeni med seboj, kot je barva znotraj seznama gradientov.

FAQ

Katere formate barv prepozna?
Hex (#rgb, #rgba, #rrggbb, #rrggbbaa), rgb()/rgba() in hsl()/hsla(), v obeh skladnjah vejice in presledka. Poimenovane barve, kot je "rdeča", se ne ujemajo.
Kaj se šteje za "isto barvo" za združevanje?
Vrednosti, ki so baj-enake, se vedno združijo. Vključitvijo možnosti enakovrednosti se tudi združi ista barva, napisana v drugačnem zapisu (hex vs rgb vs hsl). Drsnik podobnosti dodatno združi odtenke, ki so le blizu, po povprečni razliki kanala, ki jo nadzorujete.
Kako se izberejo nova imena spremenljivk?
Po vrstnem redu prve pojave, po približnem imenu odtenka in svetlosti, ali po lastnosti CSS-a, v kateri je bila barva prvič najdena — po vaši izbiri. Trčenja dobijo numerični sufiks.
Ali bo dotaknil barve znotraj komentarjev, niza ali url()?
Ne. Samo barve v dejanskih vrednostih deklaracije se ujemajo — besedilo v komentarjih, navedenih nizi in url(...) je ostalo točno, kot je napisano.
Ali je moj CSS preslikan nekje?
Ne. Ekstrakcija se izvršava v celoti v vašem brskalniku — vaš slog nikoli ne zapusti vaše naprave.