Generative cellular automata art. Each refresh creates a unique chaotic pattern using elementary cellular automata rules with vibrant color palettes and three distinct modes.
Click the image or button to experience the generative art
ChaotiColor artwork printed on a T-shirt
- Cellular Automata — Rule-based pattern generation using elementary cellular automata
- 3 Unique Modes — Different visual styles for endless variety
- 43 Color Palettes — Rich, vibrant color combinations
- Chaotic Patterns — Complex emergent patterns from simple rules
- Seed-Based — Every composition is unique and reproducible via its seed
- Save & Share — Download as PNG with seed in filename
- Apparel Mode — Preview artwork on a T-shirt mockup
- Responsive — Works on desktop, tablet, and mobile
- Pure JavaScript — No external dependencies
- Keyboard Shortcuts:
R— RegenerateS— Save imageT— Toggle apparel view
| Parameter | Range | Description |
|---|---|---|
| Color Palettes | 43 options | Predefined vibrant color combinations |
| Grid Size | 4×4 to 300×300 | Random grid dimensions |
| Modes | 3 options | Different color application styles |
| Ruleset | 8-bit | Elementary cellular automata rules |
| Pattern | Chaotic | Emergent from simple rules |
| Mode | Description |
|---|---|
| Mode 0 | Black rectangles on vibrant colored background |
| Mode 1 | Vibrant colored rectangles on black background |
| Mode 2 | Random RGB colors on black background |
# Clone the repository
git clone https://github.com/reyrove/ChaotiColor-Generative-Art.git
# Navigate to the directory
cd ChaotiColor-Generative-Art
# Open in browser
open index.html
# or use a live server- Push to GitHub
- Go to Settings → Pages
- Select branch
mainand root folder - Your site will be live at
https://reyrove.github.io/ChaotiColor-Generative-Art
The artwork is generated using elementary cellular automata with deterministic random number generation:
-
Setup:
- Chooses a random color palette from 43 options
- Determines grid dimensions (4-300 cells)
- Selects one of 3 modes
- Generates a random 8-bit ruleset
-
Cellular Automata:
- Each cell follows rules based on its neighbors
- Ruleset determines pattern evolution
- Creates complex, chaotic patterns from simple rules
-
Rendering:
- Each cell is drawn as a rectangle
- Colors vary based on mode and palette
- Patterns emerge row by row
-
Modes:
- Mode 0: Color on black background
- Mode 1: Black on color background
- Mode 2: Random RGB colors
ChaotiColor-Generative-Art/
├── index.html # Main application (all-in-one)
├── ChaotiColor.jpg # T-shirt mockup image
├── fav.svg # Favicon
├── demo-screenshot.jpg # Website demo screenshot
├── README.md # This file
└── LICENSE # MIT License
- Pure Vanilla HTML/CSS/JS — No dependencies
- Canvas API — 2D rendering
- CSS Flexbox/Grid — Responsive layout
- GitHub Pages — Hosting
| Action | Keyboard | Button |
|---|---|---|
| Regenerate | R |
Click "regenerate" |
| Save Image | S |
Click "regenerate" |
| Toggle Apparel | T |
Click "apparel" |
Each cell's state is determined by its left and right neighbors using an 8-bit ruleset. This creates complex, emergent patterns that are both chaotic and structured.
43 carefully curated color palettes provide vibrant, harmonious color combinations that bring the patterns to life.
- Mode 0: Colorful rectangles on black background
- Mode 1: Black rectangles on colorful background
- Mode 2: Random RGB colors on black background
The application automatically adapts to:
- Desktop screens
- Tablets
- Mobile phones
- Landscape orientation
- Various aspect ratios
Contributions are welcome! Feel free to:
- Fork the repository
- Create a feature branch
- Submit a pull request
- New color palettes
- Additional automata rules
- Different rendering styles
- Animation features
- Performance optimizations
MIT License — see LICENSE file for details.
- Inspired by cellular automata and generative art
- Pure JavaScript implementation
- Special thanks to the creative coding community
Built with ❤️ and chaotic beauty