Organisk CSS Blob Shape Generator
Design CSS-kantradius visuelt: fire uavhengige hjørneglidere i px eller prosent, en lenke-alle-hjørner-snarvei for øyeblikkelige sirkler og piller, pluss en organisk blob-modus med randomiserte former.
Resultat
Denne siden åpner kant-radius-generatoren direkte i blob-modus med en organisk form som allerede er lastet inn: ingen firkantede hjørner, ingen perfekt sirkel, bare en myk uregelmessig kontur bygget av CSS alene. Trykk Randomize når som helst for en ny variant.
Trikset bak hver CSS-blob er skråstreksyntaksen med åtte verdier: border-radius aksepterer to sett med fire prosenter atskilt med en skråstrek, det første settet krummer de horisontale radiene og det andre de vertikale. Mismatching mellom de to settene er akkurat det som bryter symmetrien til et vanlig avrundet rektangel til en organisk kontur.
Blobber som dette fyller det tomme rommet bak heltebilder, avatarer og illustrasjoner på utallige moderne landingssider, nettopp fordi det ikke trengs noe bibliotek eller SVG-eksport – det er fire linjer med CSS. Kopier den gjeldende formen, eller fortsett å randomisere til en føles riktig for oppsettet ditt.