A Pure CSS ikonok ez a galériája az, amit mindenki szeretne

Az Adobe tervezője Zhanging Zhang létrehozott egy érdekes webes alkalmazás mert tiszta CSS ikonok létrehozása. Ez egyszerűen megnevezett “CSS ikon” és ez lehet az egyik legmenőbb ikon generátorok a frontend fejlesztők számára.

Ez a projekt teljesen ingyenes és nyílt forráskódú a GitHub-on így szabadon letöltheted és eloszthatod a kódokat.

Ezek az ikonok nincs CSS-függősége vagy speciális böngésző funkciók szükségesek. Első pillantásra úgy tűnik, hogy az ikonok az SVG-kre épülnek, de valójában csak divs.

A CSS varázsa révén építhetsz egyéni vonal ikonok mert közös interfész elemek például a hamburger menü, a hárompontos ikon vagy a nyomtatási ikon (sok más között).

Választhat vékony vonal ikonok vagy sötét töltött ikonok. Mindketten használják hasonló CSS ​​tulajdonságok és még azt is láthatja, hogy mik azok a listán található bármely ikonra kattintva. Látni fogja a csúszó oldalsáv a HTML és a CSS kóddal együtt a kibővített ikonnal együtt.

Ha a kódmezők jobb felső sarkába néz, megjelenik a kis másolat ikonra. Kattintson erre automatikusan másolja a kódot a vágólapra. Ó, és ez a másolási ikon? Szintén Wenting tiszta CSS kódjával készült.

Nak nek változtassa meg a színt minden ikon, csak Találd meg szín ingatlan a fő ikonosztályban. Ezt frissíti szín ingatlan mindent megváltoztat.

Mivel ezek az ikonok nagyon egyszerű, valószínűleg nem fognak működni minden weboldalon. De ez egy hűvös alternatíva a képekre vagy az ikonra és ez teljesen ingyenes.

Nézd meg a CSS ikon kezdőlapja nak nek több példát láthat és a másolja / szerkessze a forrást. Te is tesztelje az egyes ikonokat külön CodePenben, ha akarsz játék körül a forrás böngészőjében.