⭐ 0
🔍
Tekstas Vaizdas PDF ir dokumentai Garsas Muzika Elektronika Laikas Komunalinės paslaugos Validatoriai Ezoterinis Žaidimai

Organinis CSS dėmių formų generatorius

Sukurkite CSS kraštinės spindulį vizualiai: keturi nepriklausomi kampiniai slankikliai pikseliais arba procentais, visų kampų nuoroda, skirta momentiniams apskritimams ir piliulei, taip pat natūralus dėmės režimas su atsitiktinių formų formomis.

12px
12px
12px
12px
Apdorojama... 0%

Rezultatas

Šiame puslapyje kraštinės spindulio generatorius atidaromas tiesiogiai dėmės režimu su jau įkelta organine forma: nėra kvadratinių kampų, nėra tobulo apskritimo, tik minkštas netaisyklingas kontūras, sukurtas vien iš CSS. Spustelėkite Atsitiktinis bet kuriuo metu, kad gautumėte naują variantą.

Kiekvienos CSS dėmės gudrybė yra aštuonių reikšmių pasvirojo brūkšnio sintaksė: kraštinės spindulys priima du keturių procentų rinkinius, atskirtus pasviruoju brūkšniu, pirmasis rinkinys išlenkia horizontalius spindulius, o antrasis – vertikalius. Dviejų rinkinių nesutapimas yra tai, kas paverčia paprasto suapvalinto stačiakampio simetriją į organišką kontūrą.

Tokios dėmės užpildo tuščią erdvę už herojų vaizdų, avatarų ir iliustracijų daugybėje šiuolaikinių nukreipimo puslapių būtent todėl, kad nereikia jokios bibliotekos ar SVG eksportavimo – tai keturios CSS eilutės. Nukopijuokite dabartinę formą arba rinkitės atsitiktine tvarka, kol atrodys tinkama jūsų išdėstymui.

🛡️
Vykdoma naršyklėje

Jūsų failai ir įvestis niekada nepalieka šio įrenginio. Apdorojimas vykdomas visiškai neprisijungus. 100% saugus.

Priimami formatai ir taisyklės

  • Kampų režimas: nepriklausomi viršutinio kairiojo, viršutinio dešiniojo, apatinio dešiniojo ir apatinio kairiojo spindulio slankikliai, kiekvienas perjungiamas tarp pikselių ir procentų vienetų.
  • Žymimasis langelis „Susieti visus kampus“, kuris perkelia kiekvieną kampą vienu slankikliu, taip pat šachmatų lentelės peržiūra šviesiame arba tamsiame fone, kad nukirpti kampai liktų matomi.
  • Blob režimas su Atsitiktinio nustatymo mygtuku, kuris sukuria natūralias aštuonių reikšmių pasvirojo brūkšnio sintaksės formas, rodomas dideles ir paruoštas kopijuoti kaip CSS.

Pagrindiniai privalumai

✓ Kiekvienas slankiklis akimirksniu atnaujina tiesioginę peržiūrą ir CSS eilutę, todėl jums niekada nereikės spėlioti, kaip iš tikrųjų atrodo 12px 40% 8px 24%.
✓ Spartusis nuorodas į visus kampus vieną slankiklį paverčia tobulu apskritimu, piliulėliu ar svirtele, neliesdami kitų trijų kampų ranka.
✓ Blob režimas generuoja natūralias, atsitiktine tvarka pasirinktas formas, naudodamas CSS aštuonių reikšmių pasvirojo brūkšnio sintaksę – žvilgsnio, kurio niekada negali sukurti vienos kraštinės spindulio vertė.

Naudojimo atvejai

  • • Nepriklausomai surinkite keturis kortelės kampų spindulius – apvalinkite tik išskleidžiamojo skydelio viršų arba tik vieną skirtuko pusę.
  • • Susiekite visus keturis kampus su vienu slankikliu, kad per kelias sekundes sukurtumėte tobulą apskritimą, stadiono formos piliulės mygtuką arba iOS stiliaus svirtį.
  • • Perjunkite į blob režimą ir paspauskite Atsitiktinis, kol natūrali forma tilps tuščioje erdvėje už herojaus atvaizdo ar pseudoportreto, tada nukopijuokite CSS.