Development · Web app
Fancy-Border-Radius
Visual generator for creating organic blob shapes using CSS border-radius
Fancy-Border-Radius is an interactive web tool that lets you design organic, asymmetrical shapes using CSS3 border-radius properties. It provides drag-and-drop handles to manipulate eight distinct border-radius values simultaneously. Once designed, the resulting CSS code can be copied directly for use in web projects.
What it's for
- Generate organic blob backgrounds for landing pages
- Design asymmetrical UI card frames or image masks
- Copy eight-value CSS border-radius rules without manual calculation
Features
- Interactive visual handles to adjust individual corner radii
- Full control over eight separate CSS border-radius values
- Custom width and height inputs for exact canvas dimensions
- One-click copy for the generated CSS code
Pricing
Free and open source
Details
- Type
- Web app
- Category
- Development
- Topic
- CSS Generators
- Open source
- Yes
- Platforms
- Web
- For
- Front-end developers and web designers
- Alternative to
- Blobmaker
- Tags
- css, generator, front end, web design, shapes, ui
Why it was saved
- @ninalyre: Allows designers and front-end developers to manipulate 8 border-radius values visually and copy the generated CSS code with one click.
Related
CSS technique for dynamic, semi-transparent borders using background-clip and backdrop-filter
CSS pattern for switching colors across themes without duplicate selectors
Lightweight, modular JavaScript animation engine for CSS, SVG, and DOM elements
React component library for Apple-style liquid glass and blur effects.
Modern CSS technique for smooth height transitions without fixed pixel heights
CSS recipe for interactive 3D card tilt and 2D layer parallax
Updated