CSS-border-radius-Generator
Erstelle abgerundete Ecken in CSS mit Live-Vorschau: Passe jede Ecke an, koppele alle vier oder erstelle organische Formen (Blob) mit den 8 Werten von border-radius.
So geht’sborder-radius- und Blob-Generator
CSS-border-radius-Generator: wofür es gut ist
Passe die vier Ecken gemeinsam oder getrennt an, in px oder %, und sieh, wie sich die Form sofort ändert. Im Blob-Modus nutze die horizontalen und vertikalen Radien, um organische Formen zu erstellen und zufällige Varianten zu erzeugen. Das CSS ist fertig zum Kopieren.
So geht’s
- Wähle Ecken oder Blob.
- Passe die Schieberegler an.
- Kopiere das erzeugte CSS.
Wann nutzen
- Abgerundete Buttons und Karten erstellen.
- Organische Formen für Hintergründe machen.
- Die Syntax von border-radius lernen.
Häufige Fragen
Wie runde ich nur einige Ecken ab?
Schalte die Option gleiche Ecken aus und passe jede an. Die Reihenfolge im CSS ist oben links, oben rechts, unten rechts und unten links.
Wie mache ich eine organische Form (Blob)?
Nutze den Blob-Modus: Er verwendet die Syntax mit Schrägstrich, wie 30% 70% 70% 30% / 30% 30% 70% 70%, wobei die Werte vor dem Schrägstrich die horizontalen und die danach die vertikalen Radien sind.
Ist das wirklich kostenlos?
Ja, 100% kostenlos. Ohne Anmeldung, ohne Abo und ohne Nutzungslimit. Alle Tools von Tools123 sind kostenlos.