SerendipitysX

@SerendipitysX·3 public vizzes

X44 Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-inspired artwork as an interactive full-screen SVG visualization. It displays alternating vertical and horizontal colored bands that are masked to reveal a circular cutout in the center of the canvas, creating a geometric interplay between line directions. The vertical stripes use a gold-to-red linear gradient, while the horizontal stripes are rendered in the default black. The piece is built entirely with raw SVG DOM manipulation via `createElementNS`, using SVG `<mask>` elements and `linearGradient` definitions to achieve the visual effect without any external libraries.

Oct 7, 2022

Loading thumbnail…

Fork of Fill & Stroke

This example demonstrates two sets of SVG shapes arranged on a white canvas: a plain rectangle, circle, and abstract path on the left, and the same shapes on the right with white fills and black strokes of 12 pixels. The code uses raw SVG elements (rect, circle, path) with explicit coordinates and path data, and the rendering approach is visible in the static markup. The fork highlights the visual difference between unfilled shapes and those with fill and stroke attributes applied.

Oct 6, 2022

Loading thumbnail…

Fork of SVG Fundamentals

This example demonstrates the foundational SVG shape of a circle, rendered as a standalone graphic element. The visualization uses the SVG API directly within an HTML document, positioning a single circle at the center of the viewport with specific coordinates and a radius. The rendering approach relies on the browser’s native SVG support, with no external JavaScript libraries or data sources. The circle is defined in the markup, and its visual representation is created by the SVG parser and renderer, following the specification’s geometric and styling rules.

Sep 19, 2022