Gratis te gebruiken, geen account nodig
CSS Randradiusgenerator
Vorm elke hoek onafhankelijk, inclusief elliptische horizontale en verticale stralen. Bekijk een voorbeeld van het resultaat en kopieer compact CSS.
Hoe genereer ik CSS border-radius-waarden?
Kies pixels of percentages, pas de horizontale en verticale straal voor elke hoek aan en kopieer vervolgens de gegenereerde border-radius-declaratie. CSS kan overlappende stralen proportioneel normaliseren om in het element te passen.
Veelgestelde vragen
Hoe genereer ik CSS border-radius-waarden?
Kies pixels of percentages, pas de horizontale en verticale straal voor elke hoek aan en kopieer vervolgens de gegenereerde border-radius-declaratie. CSS kan overlappende stralen proportioneel normaliseren om in het element te passen.
Is mijn CSS of ontwerp geüpload?
Nee. Het voorbeeld en CSS worden op dit browsertabblad gegenereerd. Er is geen upload, account, API-oproep of automatisch opslaan.
Kan elke hoek een andere straal hebben?
Ja. Stel een afzonderlijke horizontale en verticale waarde in voor de hoeken linksboven, rechtsboven, rechtsonder en linksonder.
Wat betekent de schuine streep in border-radius?
Het scheidt horizontale stralen van verticale stralen, waardoor elliptische hoeken ontstaan. Als elke hoek dezelfde horizontale en verticale waarde gebruikt, laat de generator de schuine streep weg.
Waarom kan het voorbeeld er kleiner uitzien dan de waarden?
CSS normaliseert proportioneel stralen die aan een rand zouden overlappen. Dat is standaard browsergedrag en wordt ook in deze preview toegepast.