Border-Radius-Generator

Forme vier Ecken einzeln, verknüpfe sie und kopiere die CSS-border-radius-Regel.

100 % privat — alles läuft in Ihrem Browser

So funktioniert's

1
Pro Ecke einen Radius eingeben oder Alle Ecken verknüpfen aktivieren.
2
Ein Preset wählen oder einen vorhandenen border-radius einfügen.
3
Das erzeugte CSS kopieren und im Stylesheet nutzen.

Beispiele

Abgerundete Karte

Eingabe

16px an allen Ecken

Ausgabe

border-radius: 16px;

Nur oben gerundet

Eingabe

16px 16px 0 0

Ausgabe

border-radius: 16px 16px 0 0;

Häufige Fragen

Wie wird es ein Kreis?

Quadratisches Element und alle Ecken auf 50 %; das Preset Kreis erledigt das.

Dürfen die Ecken verschieden sein?

Ja, jede Ecke hat einen eigenen Wert, auch elliptische Paare wie 40% 20%.

Gibt es ein Maximum?

Jede Länge ist erlaubt, der Browser begrenzt oberhalb der halben Elementgröße.

Ähnliche Tools

CSS-Box-Shadow-GeneratorGestalte einen CSS-box-shadow mit Live-Reglern, Presets und Vorschau und kopiere die fertige Regel.VerlaufsgeneratorErstellen Sie CSS-Verläufe (linear und radial) visuell und kopieren Sie den CSS-Code.CSS-FarbgeneratorWandeln Sie eine Basisfarbe in eine 10-stufige Farbpalette um und exportieren Sie sie als CSS-Variablen.JSON-FormatiererJSON sofort formatieren, verschönern, komprimieren und validieren — direkt im Browser.JSON-ValidatorValidieren Sie JSON sofort und finden Sie Syntaxfehler mit exakter Zeile, Spalte und Position – direkt im Browser.Base64-Kodierer/DekodiererKodieren Sie Text zu Base64 und dekodieren Sie Base64 zurück zu Text – mit voller Unicode- und Emoji-Unterstützung, direkt im Browser.