Skip to main content
100%

Fork of Get It Right - 1: SVG Fundamentals

✓ Published0🌍 Public
MMinki-Lee
Last edited Dec 11, 2022
Created on Dec 11, 2022

This example demonstrates SVG fundamentals through a minimalist composition of concentric circles over a vertically layered linear gradient. The code defines a multicolor gradient with abrupt color stops and applies a Gaussian blur filter, though the blur is not currently used on any visible elements. A single `<g>` group centers two overlapping circles in pale yellow against the dark purple-to-orange gradient background. The visualization uses only native SVG tags such as `linearGradient`, `feGaussianBlur`, `rect`, and `circle`, with no external libraries, highlighting basic shape rendering and fill techniques.

AI-generated description

Episode 1 exercise for Get it Right in Black and White

This is mainly inspired from "SVG Beyond Mere Shapes" by Nadieh Bremer, which shows cool examples of using gradients and filters in data visualizations.

MIT Licensed

Similar vizzes