# css-doodle/css-doodle

A web component for visual art and creative coding

Repository: https://github.com/css-doodle/css-doodle
Canonical: https://ross.abutalabs.com/products/css-doodle
Homepage: https://css-doodle.com
Language: JavaScript
License: MIT
License Family: permissive
Topics: css, patterns, web-component, css-doodle, generative-art, creative-coding, generative, visual-art
Last push: 2026-04-19T13:29:13+00:00

## Health v2 (maintenance only)
Score: 83/100 (v2, computed 2026-09-03T02:39:23.370411+00:00)
- activity 78, release rhythm 80, longevity 100
- inputs: {"age_days": 3488, "days_push": 136, "days_rel": 136, "gap_med": 24.5, "n_releases_24m": 11}
- flags: none
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 6030, forks 209 (observed 2026-08-28T04:09:34.421630+00:00)

## What it is
css-doodle is a web component for drawing generative patterns and visual art with CSS. It generates a grid of cells styled by CSS rules with extra utility functions for randomness, picking, and math.

## Use cases
- generate graphic patterns with css
- create generative art in the browser
- make animated visual backgrounds
- draw decorative icons with css
- create random generative decorations for a website
- explore creative coding with css

## When to choose
- you want to create patterns or generative visuals using only CSS in the browser
- you need a lightweight web component that works in all major browsers without polyfills
- you want randomness and grid-based helpers on top of plain CSS

## When to avoid
- you need canvas or WebGL-based generative art with heavy computation
- you want a full design or animation framework rather than a pattern-drawing component
- your target environment does not support custom elements or shadow DOM

## Facets
- artifact type: library
- maturity: active
- function: ui-components, graphics, animation, templating
- domain: web-development, frontend, graphics, web-design
- platform: browser
- tags: web-component, generative-art, creative-coding, css-patterns, visual-art, shadow-dom, custom-elements, web-server, nodejs

## Member repositories
- css-doodle/css-doodle (main) score 83

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:09:34.421630+00:00.
- Health v2: computed from the inputs above; adoption is never an input.
- Inferred fields (summary, facets, guidance): AI-extracted, prompt v1, taxonomy v1, on 2026-08-29T17:49:13.536141+00:00, confidence not recorded.
  - readme: https://github.com/css-doodle/css-doodle (fetched 2026-08-28T04:09:34.421630+00:00, sha 06becf2c1d62)
  - homepage: https://css-doodle.com (fetched 2026-08-29T08:45:37.492696+00:00, sha 95d57f533a15)
- Data as of 2026-08-30T08:39:29.467469+00:00.