CSS Squircle Generator — zaobljeni kvadrat
Vizualno oblikujte polmer obrobe CSS: štirje neodvisni kotni drsniki v slikovnih pikah ali odstotkih, bližnjica za povezavo vseh vogalov za takojšnje kroge in pilule ter organski način madežev z naključnimi oblikami.
Rezultat
Ta stran odpre generator polmera obrobe z vsemi štirimi vogali, povezanimi na 30 %, z zmernim zaokroževanjem, ki je med ostrim kvadratom in polnim krogom. To ni prava matematična vijuga (superelipsa), vendar je najbližje, kar lahko ena sama lastnost CSS dobi, in to je vrednost, ki jo večina oblikovalskih sistemov doseže, ko želi tak videz.
Ime izvira iz zaobljenih kvadratnih ikon aplikacij, ki jih je populariziral iOS: dovolj ukrivljen na vsakem vogalu, da se počutite mehko in prijazno, vendar nikoli tako, da bi se oblika prebrala kot okrogla. Ploščice ikon, sličice kartic in moderni okvirji avatarjev se natanko iz tega razloga opirajo na radije v istem grobem razponu.
Potisnite povezani drsnik navzgor za mehkejši, bolj okrogel občutek ali navzdol za jasnejši, bolj kvadraten - vrstica CSS se posodobi z vsako spremembo in je pripravljena za kopiranje, ko se krivulja zdi prava za vašo ikono ali kartico.