Generador CSS border-radius
Pega un valor border-radius, ajusta las esquinas visualmente y copia CSS o Tailwind. La sintaxis elíptica con barra está disponible. Generado en tu navegador — nunca se envía.
Notas para desarrolladores
• La salida sigue la contracción CSS: 1–4 tokens por lado; sintaxis con barra solo si el radio horizontal de una esquina difiere del vertical. • El export Tailwind asigna un radio px uniforme a la escala v4 (2–32px, más none/full) con ±1px; si no, rounded-[…] con guiones bajos para los espacios. • El preset Pill usa 9999px (rounded-full), no 50%. El 50% solo es un círculo en una vista previa cuadrada. • Ancho/alto de vista previa son estado de UI en la URL, no opciones expuestas, y no cambian la cadena exportada cuando la unidad es px.
Opciones
- Vincular esquinas — Activado: editar una esquina actualiza las cuatro — el flujo habitual de tarjeta/botón. Desactivado: control independiente arriba-izquierda, arriba-derecha, abajo-derecha, abajo-izquierda.
- Unidad — Sufijo aplicado a cada esquina y a la cadena exportada: px (absoluto) o % (relativo a las dimensiones del elemento). El preset círculo usa %; tarjeta y píldora usan px.
- Elíptico — Desactivado: un radio por esquina (máx. 4 valores). Activado: radio horizontal y vertical por esquina, sintaxis de 8 valores con barra cuando cualquier par difiere.
- Formato de export — Portapapeles: declaración CSS border-radius, custom property --radius, clase Tailwind rounded-* más cercana (alternativa rounded-[…]) o utilidad Bootstrap 5 rounded-* (alternativa style inline).
Herramientas CSS relacionadas
Hub: Herramientas de Color y CSS. Convierte colores con el Conversor de colores, genera escalas de tonos con el Generador de tonos, o reduce y formatea hojas con Minificar CSS y Formatear CSS.
FAQ del generador CSS border-radius
Editor local de esquinas redondeadas
¿Puedo pegar un border-radius existente desde DevTools?
Sí. Pega 1–4 longitudes, sintaxis de barra de 8 valores u una declaración completa border-radius: …;. Una entrada inválida muestra un error y conserva la última vista previa válida.
¿Qué hace el modo elíptico?
Desbloquea un radio horizontal y vertical por esquina. Cuando cualquier par difiere, la salida CSS usa sintaxis con barra (a b c d / e f g h).
¿Cómo elige la clase el export Tailwind?
Un radio en píxeles uniforme a ±1px de la escala Tailwind v4 se convierte en rounded-none, rounded-xs … rounded-4xl o rounded-full. Cualquier otra cosa, incluido %, barra y esquinas mixtas, se convierte en rounded-[…].
¿Se envía mi CSS a algún sitio?
No. El análisis y el ensamblado se ejecutan por completo en tu navegador. FastMinify nunca envía el valor pegado a un servidor.
Herramientas color y CSS
Comprobación de contraste WCAG pegada localmente con sintaxis de color CSS moderna — vistas de par y matriz, nunca se sube.
Explorar otras categorías de herramientas
Minificar
Reduce código y assets para producción — minifica JavaScript, CSS, HTML, JSON y XML antes de gzip o un despliegue CDN.
Desminificar
Expande código minificado o comprimido — desminifica JavaScript, CSS, TypeScript, SCSS, LESS, SQL, YAML y otros formatos al depurar o revisar.
Conversión
Transforma datos entre JSON, YAML, XML y CSV en local — sin subidas a un servidor.
Codificación
Codifica o decodifica Base64, componentes URL y entidades HTML — solo en el cliente.
Serialización
Serializa y deserializa estructuras PHP junto a los flujos JSON.
Herramientas JSON
Valida, formatea, compara y explora payloads JSON — complementarias a minificadores y convertidores.
Herramientas SVG
Previsualiza, optimiza con SVGO, exporta Data URI, redimensiona, embellece, convierte a JSX y valida SVG — todo en tu navegador.
Embellecer
Haz el código legible con una indentación coherente — embellece JavaScript, CSS, TypeScript, SCSS, LESS, Markdown, GraphQL, SQL, YAML y más en tu navegador.
Preprocesadores CSS
Compila SCSS o LESS a CSS estándar en el navegador — combínalo con embellecer o minificar para un flujo de hoja de estilos completo.
DevOps e Infra
Formato, validación y minificación de Terraform HCL, formato y lint de Dockerfile, validación de Docker Compose y .env.
CI/CD
GitHub Actions y GitLab CI — formatear YAML y comprobar la estructura de workflows/jobs en el navegador.
Logs y observabilidad
JSON/NDJSON línea a línea y access logs de Nginx/Apache — formato, filtro, validación y CSV/TSV.
Kubernetes
Manifiestos multi-doc, validación estructural, starters Ingress/Deployment y formato de values de Helm.
Red / IP
CIDR, subredes y ayudas IPv4/IPv6 — en tu navegador.
Seguridad y tokens
JWKS, certificados X.509 y escaneo de secretos — en local en el navegador.
API y esquemas
Herramientas OpenAPI para formatear, validar y analizar tus specs.
Herramientas HTTP
cURL, mensajes HTTP, URLs, HAR y Cookie / Set-Cookie pegados en el navegador — formatear e inspeccionar, nunca se envían.
Herramientas SEO / Web
Genera meta tags, Open Graph y Twitter Card localmente — vistas simuladas desde tus entradas, nunca fetch de tu sitio en vivo.
Utilidades para desarrolladores
Timestamps, UUID, ULID, Nanoid, cron, contraseñas, regex, slugify, bases numéricas, mayúsculas, diff de texto y chmod — todo en el cliente.
Texto y Markdown
Cuenta palabras, genera TOC Markdown y limpia listas de líneas — todo en tu navegador.
IA y LLM
Conteo de tokens, estimación de costes y ajuste a la ventana de contexto — 100 % en el navegador.
Datos de prueba
Valores de campo sintéticos para fixtures y seed de BD — primero números de teléfono en rangos reservados.
Etiquetas de código de barras
Dibuja etiquetas Code 128, EAN-13 y UPC-A en el navegador — descarga PNG y SVG, no es un lookup GS1.