SiteDesign Tools & Generators · CSS generators (Temani Afif)
Converts an SVG path into an equivalent CSS clip-path or mask so shapes stay resolution-independent.
Why it’s a gem
Part of a one-man CSS empire; every output is single-element, image-free and copy-paste ready
Generates organic blob shapes as CSS border-radius or clip-path values, so blobs stay resolution-independent and animatable.
Generates speech-bubble and tooltip shapes with arbitrary tail position and border in pure CSS.
Builds tunable wavy edge dividers in pure CSS with amplitude and frequency controls.
Serves a random modern-CSS technique with runnable demo, as a daily learning surface.
Generates notched, scooped and cut-corner CSS shapes on a single element, without pseudo-element hacks or image assets.
Generates CSS-only decorative borders — corner brackets, partial frames and offset outlines — with no extra markup.