Oluseyi Adeeko

@Shaeyi2222·4 public vizzes

Smiley face redo>>>

This hand-coded SVG example depicts a cheerful, static smiley face built from yellow circles, black ellipses, and a curved path for the mouth. The code defines shapes directly in the SVG markup, setting explicit coordinates for the eyes, pupils, and facial features to create a symmetrical composition. Using core SVG elements like `<circle>`, `<ellipse>`, and `<path>`, the visualization showcases basic vector drawing techniques without any JavaScript libraries. A CSS transition on the `.pupil` class demonstrates a hover interaction, where the pupils translate upward smoothly, adding a playful dynamic to the otherwise static face.

Nov 8, 2023

Loading thumbnail…

Fork of Sol lewitt_vertical

This example displays a full-screen SVG canvas filled with one hundred horizontal 10-pixel-high rectangles, layered vertically to create a striped pattern. A circular mask, centered on the viewport, reveals only the central portion of the bars, leaving the rest of the canvas blank. The work is a direct adaptation of Sol LeWitt’s geometric style, rendered using the standard DOM API for SVG creation and manipulation, with the mask and shapes defined programmatically, though the mask is not applied to the rectangles in the final loop.

Sep 22, 2023

Loading thumbnail…

Sol lewitt

This example creates a minimalist, generative wall drawing inspired by Sol LeWitt’s geometric instruction art. It displays a series of one hundred thin, evenly spaced vertical rectangles that span the full height of the browser window. The composition is rendered as SVG, constructed dynamically with the `document.createElementNS` and `svg.setAttribute` APIs, without using any external libraries. The code generates the pattern procedurally by looping through an index, setting each rectangle’s x position incrementally, resulting in a clean, grid-like visual.

Sep 22, 2023

Loading thumbnail…

Creations

The example shows a static SVG scene containing two circles, a yellow line, and a red polyline path arranged on a 960 by 500 canvas. It renders directly using SVG elements created in HTML, with no external data or JavaScript libraries. The code sets the geometry and styling attributes—such as coordinates, radii, stroke colors, and fill—directly on `<circle>`, `<line>`, and `<path>` elements within the page markup. The visualization demonstrates basic vector shape composition without interactivity or animation.

Sep 13, 2023