Bästa fria CSS Gränsradiusgenerator

Runda element hörn visuellt - per-hörn eller länkad, px/% / dem - med live förhandsvisning och kopia.

100% fri Ingen registrering Inget vattenmärke
Gå Pro för de bästa AI-modellerna - bild, video och chatt - plus större uppladdningar, prioritet i kön och ingen väntan. Uppgradera till Pro
Kärlek Best.Free? Dela den

Hur det fungerar

  1. Ställ in hörnen. Dra varje hörnreglage, eller hålla Länk alla hörn på för att flytta dem tillsammans.
  2. Titta på förhandsgranskningen. Liveboxen rundar när du drar; växla px, % eller em i avancerade alternativ.
  3. Kopiera CSS. Tryck på Kopiera CSS och klistra in gränsradius regeln i din stilmall.

Om detta verktyg

Runda hörnen av ett element exakt hur du vill ha dem. Dra ett skjutreglage för vart och ett av de fyra hörnen - eller håll dem länkade så att ett skjutreglage flyttar alla fyra - medan en levande förhandsgranskningsruta visar resultatet. Kopiera gränsen-radius CSS, som kollapsar till ett enda värde när varje hörn matchar och expanderar till fyra- värde formen när de skiljer sig. De avancerade alternativen byter enheten mellan px, % och em, så att du kan bygga piller former och procentbaserade avrundning också.

Vad folk använder det till

  • Runda kort, knapp och bildhörn
  • Skapa ett piller eller helavrundad form
  • Ställ in olika radier i enskilda hörn
  • Använd procentuell avrundning för cirklar och ovala

Vanliga frågor

Ja. Stäng av Länk alla hörn och varje skjutreglage styr ett hörn. CSS använder sedan fyra-värdesformen (överst till vänster, överst till höger, nederst till höger, nederst till vänster).

Med den på, drar någon reglage flyttar alla fyra hörn tillsammans och CSS kollapsar till ett enda värde.

Procentrundor i förhållande till boxens storlek, så 50% på en kvadrat gör en cirkel och den skalar med elementet. Pixlar ger en fast radie.

Ställ in en stor radie på alla hörn; för en sann piller, en radie av halva elementets höjd - eller 50% - rundar ändarna helt.

Nej. Reglagen beräknar en CSS-sträng lokalt i din webbläsare.

Helt gratis, inget konto och inga gränser - ett klient-side verktyg utan något att mäta.

Ja. Det körs i din webbläsare, så CSS Border Radius Generator fungerar på telefoner och surfplattor samt skrivbord - det finns ingen app att installera.

Vanligtvis bara några sekunder för en typisk fil - CSS Border Radius Generator börjar fungera när du ger det din ingång.

Det är obegränsat med användning av engångsartiklar, med ett generöst lock för rättvis användning som håller det snabbt för alla.

Alla moderna webbläsare - Chrome, Safari, Firefox och Edge. CSS Border Radius Generator behöver ingenting installerat utanför webbläsaren du redan använder.

Verktyg i anslutning till detta

Betygsätt denna sida
5.0/5 (0)

Vad kan vi förbättra? Din feedback hjälper oss att lösa problem.