Skip to main content
SimilarExport ZIP
100%

shapes n shit

✓ Published0🌍 Public
AAveryBurke
Last edited Jan 12, 2019
Created on Jan 12, 2019
Forked from Hello VizHub

This example displays a simple SVG scene titled “shapes n shit,” featuring a circle and a rectangle rendered on a dark, centered page. The visualization uses raw SVG markup within an HTML document, with basic styling applied via CSS, including a large Ubuntu font. D3.js is imported to demonstrate setting text content, though the primary rendering relies on native SVG elements. The composition is static, with no interaction or animation, showing basic geometric shapes against a minimal, high-contrast background.

AI-generated description

This is a description using Markdown.

MIT Licensed

Similar vizzes

Loading thumbnail…

Shapes with SVG and CSS

This example displays a collection of basic geometric shapes—circles, a polygon, and a rectangle—arranged in a fixed composition on an 800-by-500 canvas. The scene includes overlapping elements, such as a white circle with a black stroke and a teal triangle paired with a circle, rendered directly via standard SVG markup. Styling is applied through an external CSS file, which sets the page’s font and margin properties. The visualization demonstrates how raw SVG elements and CSS rules combine to create a static, illustrative graphic without any JavaScript libraries.

Rrangitit
85% match
Loading thumbnail…

Shapes with SVG

This example displays four basic SVG shapes—two circles and two rectangles—positioned on a plain dark background. The shapes use default black fills for the first circle and rectangle, while the second circle and rectangle are explicitly colored red and green. The visualization is built entirely with static SVG markup in an HTML file, styled by a separate CSS file, and does not use any JavaScript libraries or data binding. It demonstrates how raw SVG elements can compose a simple static scene.

LLoraay-A
84% match
Loading thumbnail…

Shapes with SVG

This example demonstrates basic SVG shape rendering within a webpage, displaying circles, rectangles, lines, and a path. The shapes are organized in groups with transforms for scaling and translation, and styled via inline attributes and a CSS class. The visualization uses the SVG API directly within an HTML document, alongside D3.js’s `select` function for setting text content. Data is sourced from the static HTML and JavaScript files, with styling applied through an external stylesheet.

MMichał Szumnarski
84% match
Loading thumbnail…

Shapes with SVG and CSS

This example demonstrates a minimal SVG-based visualization featuring a single large circle rendered within an HTML document. The circle is positioned using SVG’s `r` attribute, while the page styling and full-bleed layout are handled through CSS in an external stylesheet. The visualization relies on the native SVG element and CSS rules for sizing and overflow control, with no additional JavaScript libraries or data sources involved. The result is a clean, static illustration of basic shape rendering and styling in a web environment.

DDjan Magno
83% match
Loading thumbnail…

Shapes with SVG and CSS

This example displays a simple SVG scene composed of a green circle and a black-outlined rectangle, both grouped within an SVG element. The shapes are positioned using the `transform` attribute and styled with inline fill and stroke properties, while a linked stylesheet defines global body margins and a `.highlighted` class. The visualization demonstrates foundational SVG shape rendering and CSS integration in a static, non-interactive HTML document.

Ggharakhani1986
83% match
Loading thumbnail…

Shapes with SVG and CSS

This example demonstrates how to render shapes in an SVG canvas with CSS styling. It loads D3 through UNPKG and uses an SVG circle element with a radius set to 100 pixels. The stylesheet defines a basic body reset and a highlighted class that changes text color to red, though the circle itself does not currently apply this class. The visualization shows the structure for combining raw SVG markup with external styling rules.

BBlakeMcMurray
83% match
Loading thumbnail…

shapes with svg and css

This example demonstrates basic SVG shapes—circles, rectangles, lines, and a group—styled and transformed with CSS attributes like fill, stroke, and translate. It shows how static SVG elements can be composed and visually customized in a web page. The rendering uses raw SVG markup embedded in HTML, with external styles applied via a linked stylesheet. No JavaScript libraries drive the visualization; the included D3 import and message module remain unused in the final display.

JJokerhan88
83% match
Loading thumbnail…

Shapes with SVG and CSS

This example showcases a simple SVG-based visualization that renders shapes on an HTML canvas, styled with CSS. It demonstrates the integration of SVG elements within a webpage, using a monospace font and red highlighting for emphasis. The code relies on the SVG API for drawing and CSS for presentation, with no external data source. The visualization is static, focusing on the visual composition of basic geometric forms rather than dynamic data representation.

Jjbrauckman
83% match