Border Radius Generator

Reunuksen säteen määritys voi sisältää jopa neljä itsenäistä kulma-arvoa sekä valinnaisen kahdeksan arvon vinoviivasyntaksin orgaanisille käyrille – enemmän liikkuvia osia kuin useimmat ihmiset ymmärtävät, kunnes he tarvitsevat jotain muuta kuin yksinkertaisen pyöristetyn kortin. Tämä generaattori näyttää kaikki näistä osista: neljä kulman liukusäädintä omalla px-tai-prosenttiyksiköllä, link-all-corners-pikakuvake symmetrisille muodoille ja blob-tila muodoille, joita yksittäinen sädearvo ei voi ilmaista.

Kulmat-tila kattaa muodot, joita ihmiset todellisuudessa tavoittelevat: linkitä jokainen kulma yhteen liukusäätimeen täydellisten ympyröiden, pillereiden ja squirleiden saamiseksi tai irrota ne pyöristääksesi vain avattavan paneelin yläosan tai vain kortin yhden puolen. Muodon takana oleva shakkilaudan esikatselu, joka on vaihdettavissa vaalean ja tumman taustan välillä, tekee selväksi, mitkä kulmat leikataan pois millä tahansa säteellä – samat visuaaliset tempputiedostotyökalut tällä sivustolla osoittavat läpinäkyvyyttä.

Blob-tila on toinen puoli: CSS:n kahdeksan arvon vinoviivasyntaksi sallii kunkin kulman vaaka- ja pystysäteiden olla eri mieltä, mikä muuttaa pyöristetyn suorakulmion orgaaniseksi, epäsäännölliseksi ääriviivaksi. Napauta Randomize saadaksesi tuoreen muodon milloin tahansa ja kopioi tarkka CSS sen takana – ei SVG-vientiä tai ulkoista kirjastoa. Esiasetetut sivut kattavat pyynnöt, jotka ihmiset todella kirjoittavat hakukenttään: täydellinen ympyrä, stadionin muotoinen pilleripainike, iOS-tyylinen squircle ja valmis orgaaninen möykky.

Kuten kaikki tämän sivuston työkalut, se toimii kokonaan selaimessasi: ei latausta, ei tiliä, ja generaattori toimii offline-tilassa, kun sivu on latautunut.