Here you’ll find all the CodePen examples accompanying my book Generative Art with JavaScript and SVG, published by Apress.
You can also browse the code on Github or download the repository here.
Contents
- Hilma af Klint-inspired Composition (raw SVG example)
- Cornflower Blue in SvJs
- Our First Generative Sketch
- Elements Everywhere All At Once
- Regular Grids
- Clip Path Patterns
- Chance In Action
- Gaussian Distribution
- Porto Pareto
Chapter 1 Examples
Hilma af Klint-inspired Composition
See the Pen Gen Art Book 1.1 Hilma af Klint-Inspired Composition by David Matthew (@davidmatthew) on CodePen.
Cornflower Blue in SvJs
See the Pen Gen Art Book 1.2.1 Simple Rect with SvJs by David Matthew (@davidmatthew) on CodePen.
Our First Generative Sketch
Re-run this one for different results.
See the Pen Gen Art Book 1.3 Our First Generative Sketch by David Matthew (@davidmatthew) on CodePen.
Chapter 2 Examples
Web-Safe Colour Spiral
See the Pen Gen Art Book 2.1 Web-Safe Spiral by David Matthew (@davidmatthew) on CodePen.
Chapter 3 Examples
Adjusting the viewBox
See the Pen Gen Art Book 3.1 Adjusting the viewBox by David Matthew (@davidmatthew) on CodePen.
Rectangle Colour Illusion
See the Pen Gen Art Book 3.2 Rectangle Colour Illusion by David Matthew (@davidmatthew) on CodePen.
Circle Overlay Loop
See the Pen Gen Art Book 3.3 Circle Overlay Loop by David Matthew (@davidmatthew) on CodePen.
Chalkboard Gag
See the Pen Gen Art Book 3.4 Chalkboard Gag by David Matthew (@davidmatthew) on CodePen.
Optical Illusion
See the Pen Gen Art Book 3.5 Optical Illusion by David Matthew (@davidmatthew) on CodePen.
Chapter 4 Examples
Elements Everywhere All At Once
See the Pen Gen Art Book 4.1 Elements Everywhere All At Once by David Matthew (@davidmatthew) on CodePen.
Regular Grids
See the Pen Gen Art Book 4.2 Regular Grids by David Matthew (@davidmatthew) on CodePen.
Clip Path Patterns
See the Pen Gen Art Book 4.3 Clip Path Patterns by David Matthew (@davidmatthew) on CodePen.
Chance In Action
See the Pen Gen Art Book 4.4 Chance In Action by David Matthew (@davidmatthew) on CodePen.
Gaussian Distribution
See the Pen Gen Art Book 4.5 Gaussian Distribution by David Matthew (@davidmatthew) on CodePen.
Porto Pareto
See the Pen Gen Art Book 4.6 Porto Pareto by David Matthew (@davidmatthew) on CodePen.
Chapter 5 Examples
Noise Matrix
See the Pen Gen Art Book 5.1 Noise Matrix by David Matthew (@davidmatthew) on CodePen.
Spinning Noise
See the Pen Gen Art Book 5.2 Spinning Noise by David Matthew (@davidmatthew) on CodePen.
Chapter 6 Examples
Quadratic Slinky
See the Pen Gen Art Book 6.1 Quadratic Slinky by David Matthew (@davidmatthew) on CodePen.
Interactive Arc Curve
See the Pen Gen Art Book 6.2 Interactive Arc Curve by David Matthew (@davidmatthew) on CodePen.
Generative Arcs
See the Pen Gen Art Book 6.3 Generative Arcs by David Matthew (@davidmatthew) on CodePen.
Organic Curves
See the Pen Gen Art Book 6.4 Organic Curves by David Matthew (@davidmatthew) on CodePen.
Chapter 7 Examples
Cursor Tracking
See the Pen Gen Art Book 7.1 Cursor Tracking by David Matthew (@davidmatthew) on CodePen.
Making Things Move
See the Pen Gen Art Book 7.2 Making Things Move by David Matthew (@davidmatthew) on CodePen.
Collision Detection
See the Pen Gen Art Book 7.3 Collision Detection by David Matthew (@davidmatthew) on CodePen.
Circular Loop
See the Pen Gen Art Book 7.4 Circular Loop by David Matthew (@davidmatthew) on CodePen.
Chapter 8 Examples
Colour Filter
See the Pen Gen Art Book 8.1 Colour Filter by David Matthew (@davidmatthew) on CodePen.
Turbulence
See the Pen Gen Art Book 8.2 Turbulence by David Matthew (@davidmatthew) on CodePen.
Hubble Bubble
See the Pen Gen Art Book 8.3 Hubble Bubble by David Matthew (@davidmatthew) on CodePen.
Rough Paper
See the Pen Gen Art Book 8.4 Rough Paper by David Matthew (@davidmatthew) on CodePen.
Rocky Randomness
See the Pen Gen Art Book 8.1 Colour Filter by David Matthew (@davidmatthew) on CodePen.
Chapter 9 Examples
Trigonometry
See the Pen Gen Art Book 9.1 Trigonometry by David Matthew (@davidmatthew) on CodePen.
Fractals
- Playing with Chaos, by Keith Peters
- Fractals, from Chapter 8 of The Nature of Code, by Daniel Shiffman