🎨 CSS Border-Radius & Blob Generator

100% Client-Side
Fórmula CSS (8 Ejes) 50% 50% 50% 50% / 60% 40% 60% 40%
Radios Horizontales 50 / 50 / 50 / 50
Radios Verticales 60 / 40 / 60 / 40
Tipo de Forma Orgánica (Blob)
⚙️ Controles de los 8 Ejes
↔ Radios Horizontales (%)
↕ Radios Verticales (%)
Blob Shape
/* Standard CSS */
/* Utility class */
<!-- SVG Path -->
/* Morph animation keyframes */

¿Qué es Generador CSS de Border Radius y cómo funciona?

La herramienta Generador CSS de Border Radius de Teclea.Dev Run te permite procesar y transformar datos directamente en tu navegador web. Design organic blob shapes with an interactive 8-axis border-radius generator: drag 8 handles on canvas or fine-tune sliders, then export CSS, utility classes, SVG paths or morphing keyframe animations. Toda la ejecución se realiza en memoria en el cliente sin transferir información privada a servidores externos.

📖 Guía de Uso Rápido

  1. Arrastra Tiradores en el Lienzo: Mueve cualquiera de los 8 tiradores en la vista previa para moldear la forma.
  2. Ajuste Fino de Deslizadores: Modifica los radios horizontales (H1–H4) y verticales (V1–V4) con precisión numérica.
  3. Presets Rápidos: Formas instantáneas como Blob Orgánico, Squircle, Huevo, Hoja y Ola.
  4. Exportación Multiformato: Genera CSS estándar, clases de utilidad Tailwind, vectores SVG escalables y animaciones @keyframes morph.
  5. 100% Client-Side: Todo el diseño interactivo ocurre en el navegador.

Ventajas y Características Técnicas