8ingo8ongo

@8ingo8ongo·2 public vizzes

test

A full-width red rectangle sits against a plain white background, its thick black stroke defining the shape. The example showcases a simple CSS and SVG interaction, where the rectangle transitions to green on hover. Written as a minimal HTML page, it uses inline CSS for styling and transitions, while JavaScript is included but not yet utilized. The SVG element is drawn directly in the markup, offering a straightforward demonstration of static vector graphics and hover feedback.

Sep 5, 2023

Loading thumbnail…

SVG Fundamentals

This example demonstrates the fundamental building blocks of SVG graphics. It shows a yellow rectangle with a blue border and a filled black circle positioned on a 600 by 600 canvas, with no interactive behavior. The code defines the shapes directly in an HTML file using the inline SVG element. It renders vector primitives, including `<rect>` and `<circle>`, and applies styling through attributes like `fill`, `stroke`, and `stroke-width`. The rendering uses the built-in browser support for SVG, with no additional JavaScript or libraries.

Aug 29, 2023