Koduleht » Toolkit » Tasuta CSS koodigeneraator Instagram-stiilis filtritele

    Tasuta CSS koodigeneraator Instagram-stiilis filtritele

    Kui lahe oleks lisada pildifiltrid saidile? Aastaid tagasi oleks see vaja JavaScriptit, kuid tänapäeval on teil võimalik luua kohandatud vanad HTML ja CSS pildifiltrid.

    Ja cssFilters webappiga ei pea sa isegi ühtegi CSS koodi kirjutama!

    See tasuta tööriist aitab teil luua CSS3 filtrite abil kohandatud pildifiltreid. Leiad palju juhendeid, mis katavad üksikasjalikult CSS-filtri omadusi. Kuid cssFiltersiga ei pea te muretsema, kuidas see kõik toimib, lihtsalt kohandate oma seaded ja kopeerite koodi.

    Ekraani ülaosas näete pikka baari, mis on täis kohandatud Instagram-filtreid. Need filtrid sisaldavad kõiki populaarseid valikuid, nagu Hudson, Toaster, Inkwell, Lofi ja paljud teised.

    Klõpsake lihtsalt soovitud filtril ja seejärel klõpsake nuppu “CSS-kood” paremas nurgas. Sealt saad nii HTML kui ka CSS koodi. Lihtsalt kopeerige / kleepige oma veebisaidile ja sa oled hea minna.

    Kuid neid filtreid saate kohandada ka seadete liuguritega. Alla “generaator” vahekaardil saate muuta seadistusi, nagu küllastumine ja kontrastsus, koos hägususe, halltoonide, seepia ja isegi ülekatte stiiliga, nagu lineaarne gradiendi või radiaalne gradient.

    Iga kord, kui liigutate liugurit, värskendab see automaatselt koodi, nii et sa ei pea midagi salvestama.

    Ja te saate isegi vaikepildi vahetada, laadides ühe arvutisse või valides ühe Unsplashist.

    Selle veebihäälestuse tegi Indrashish Ghosh ja see käivitab palju CSSgrami raamatukogus leiduvaid vaikeklasse.

    Kuid kohandatud seadistused ulatuvad kaugemale põhiväärtustest ja vaba koodide genereerimine teeb sellest mugavaks tööriistaks nii programmeerijate kui ka mittekodeerijate jaoks. Meil on juba mitu CSS3 generaatorit selliste omaduste jaoks nagu taustgradientid ja teksti varjud. Ja nüüd on meil CSS3 kujutisfiltri generaatorina cssFiltreid.