CodePen Experiments

This repository is a collection of CodePen experiments that I have developed with the aim of exploring, innovating, and pushing the boundaries of digital creativity.

Table of contents
Pens Astro commands

Pens

• Meeting Point
  ^{css css-animation pure-css meeting point}
  A visual composition animated, created solely with HTML and CSS
  Full Page View — Editor View

• Energy Pyramid
  ^{css css-animation pure-css energy pyramid}
  A visual composition animated, created solely with HTML and CSS
  Full Page View — Editor View

• Behind Bars
  ^{css css-animation pure-css behind bars}
  A visual composition with bars and animated circles on a circular canvas, created solely with HTML and CSS
  Full Page View — Editor View

• Cell Rest
  ^{svg morph css-animation css-morph gradient-animation}
  SVG morph animation
  Full Page View — Editor View

• FeverShape 001
  ^{svg svg-animation css css-animation illustration}
  Animated SVG illustration with geometric designs
  Full Page View — Editor View

• FeverShape 002
  ^{svg svg-animation css css-animation illustration}
  Animated SVG illustration with geometric designs
  Full Page View — Editor View

• FeverShape 003
  ^{svg svg-animation css css-animation illustration}
  Animated SVG illustration with geometric designs
  Full Page View — Editor View

Astro commands

All commands are run from the root of the project, from a terminal:

Command	Action
npm install	Installs dependencies
npm run dev	Starts local dev server at localhost:3000
npm run build	Build your production site to ./dist/
npm run preview	Preview your build locally, before deploying
npm run astro ...	Run CLI commands like astro add, astro check
npm run astro -- --help	Get help using the Astro CLI