Export Image
Export Code

Moving Circular Grid

Curran Kelleher

0 views in last 90 days
Last edited Aug 06, 2025
Created on Aug 06, 2025

Sol LeWitt Art Piece

An interactive SVG art piece inspired by Sol LeWitt's geometric works. Features rotating horizontal lines contained within a static circular boundary.

Features

  • Responsive canvas that adapts to window size
  • Static circular clipping path defines the visible area
  • Rotating horizontal lines using CSS animations
  • 100 horizontal and 100 vertical lines creating a grid pattern
  • The rotation is applied only to the horizontal lines container

How It Works

  1. A static circle clip path is created at the center of the canvas
  2. Horizontal lines are grouped together and clipped to the circle boundary
  3. The horizontal lines group has a rotation animation applied
  4. Vertical lines cover the entire canvas without any clipping
  5. The rotation animation spins the horizontal lines group while the circular boundary remains fixed
MIT Licensed