CSS Visual ToolsLesson 87Free preview
CSS Blob Generator
This lesson is part of Web Developer Tools · All levels
Summary
CSS blob generators help create uncoordinated organic shapes for background decoration or illustration. The shape can be formed by an eight-valued border-radius or by an SVG path. The blobs are usually softly coloured and sometimes animated to feel alive.
Key points
- Blobs are organic shapes with an un symmetrical angle
- The border-radius of eight values can form a blob without a picture
- Slash separates the horizontal and vertical radius
- The SVG path gives more precise shape control
- Mark the decorative blob with hidden airs so as not to disturb the screen reader
Full lesson
Code examples and quizzes
Full lessons, code examples, and quizzes are available to subscribers. 5 questions.