Die Entwickler-Tools, zu denen du jeden Tag greifst, alle an einem Ort.

Konverter, Formatter, Hashes, Validatoren und die kleinen Helfer, die du immer wieder öffnest, bleiben zusammen, statt zwischen Tabs verloren zu gehen.

GitHub

/ Tools

■

/ Tool-Finder

109 Tools

/ Border-Radius-Generator

Einheit

Presets

Alle Ecken verknüpfen

Oben links: 12px

Oben rechts: 12px

Unten links: 12px

Unten rechts: 12px

Vorschaufarbe

Vorschaugröße: 150px

Vorschau

CSS-Code

Individuelle Eckeneigenschaften

Tailwind-Klasse

/ Ausgewähltes Tool

■

Border-Radius-Generator - kostenloses Generator-Tool

Visueller CSS-border-radius-Generator mit individueller Eckensteuerung

■ 01

Was ist CSS Border Radius?

Die CSS-Eigenschaft border-radius rundet die Ecken der äußeren Rahmenkante eines Elements ab. Du kannst alle vier Ecken auf denselben Wert setzen oder für jede Ecke unterschiedliche Werte angeben, um einzigartige Formen zu erstellen.

■ 02

Wie funktioniert es?

Der Rahmenradius kann mit 1 bis 4 Werten angegeben werden. Bei 1 Wert sind alle Ecken gleich. Bei 2 Werten gilt der erste für oben-links/unten-rechts und der zweite für oben-rechts/unten-links. Bei 3 Werten: oben-links, oben-…

■ 03

Beispielfälle

Deckt Alle Ecken gleich, Pillenform und Unterschiedliche Ecken ab, damit du gängige Ein- und Ausgaben schnell vergleichen kannst.

/ Verwandte Tools

/ Code

■

Quellcode des ausgewählten Tools, hier neben der Live-Version auf der rechten Seite gezeigt.

/ Quellcode

TypeScript

typescript

// No external dependencies needed - generates CSS border-radius strings

interface BorderRadius {
  topLeft: number;
  topRight: number;
  bottomRight: number;
  bottomLeft: number;
  unit: 'px' | '%' | 'rem';
}