# martinlaxenaire/curtainsjs

curtains.js is a lightweight vanilla WebGL javascript library that turns HTML DOM elements into interactive textured planes.

Repository: https://github.com/martinlaxenaire/curtainsjs
Canonical: https://ross.abutalabs.com/products/curtainsjs
Homepage: https://www.curtainsjs.com/
Language: JavaScript
License: MIT
License Family: permissive
Topics: javascript, webgl, 3d, html5, canvas, responsive, shaders, glsl, texture, curtains, curtainsjs, webgl2, shader, dom
Last push: 2025-04-03T08:29:16+00:00

## Health v2 (maintenance only)
Score: 39/100 (v2, computed 2026-09-02T17:46:02.011165+00:00)
- activity 14, release rhythm 35, longevity 100
- inputs: {"age_days": 3052, "days_push": 517, "days_rel": null, "gap_med": null, "n_releases_24m": 0}
- flags: no_releases
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 1824, forks 115 (observed 2026-08-28T04:05:41.240657+00:00)

## What it is
curtains.js is a lightweight vanilla WebGL JavaScript library that converts HTML DOM elements containing images, videos, and canvases into 3D WebGL textured planes. It lets you position planes via CSS and animate them with custom vertex and fragment shaders, including post-processing effects.

## Use cases
- animate images with custom WebGL shaders
- create scroll-driven parallax and displacement effects on DOM elements
- apply shader effects to videos on a webpage
- add post-processing passes to a web page scene
- build responsive WebGL planes synced to HTML layout
- create interactive shader-based image galleries

## When to choose
- you want WebGL effects tightly synced with DOM element positions and CSS layout
- you know GLSL shader basics and want a lightweight, dependency-free library
- you need responsive shader-animated images or videos without a full 3D engine like Three.js

## When to avoid
- you need full 3D scenes with models, lighting, and cameras rather than DOM-bound planes
- you have no shader/GLSL knowledge and want purely CSS-based animation
- you need React integration out of the box without the separate react-curtains package

## Facets
- artifact type: library
- maturity: active
- function: graphics, animation, ui-components, image-processing, video-processing
- domain: web-development, frontend, graphics, web-design
- platform: browser
- tags: webgl, glsl, shaders, dom, textured-planes, post-processing, creative-coding, javascript, nodejs

## Member repositories
- martinlaxenaire/curtainsjs (main) score 39

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:05:41.240657+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-30T03:19:43.963671+00:00, confidence not recorded.
  - readme: https://github.com/martinlaxenaire/curtainsjs (fetched 2026-08-28T04:05:41.240657+00:00, sha 531062a7a457)
  - homepage: https://www.curtainsjs.com/ (fetched 2026-08-29T10:58:51.085696+00:00, sha cc2556f94d78)
  - site_page: https://www.curtainsjs.com/documentation.html (fetched 2026-08-29T10:58:51.094768+00:00, sha 74669f9c6c43)
  - registry_npm: https://registry.npmjs.org/curtainsjs (fetched 2026-08-29T10:58:51.096805+00:00, sha 9e22723d38b1)
- Data as of 2026-08-30T08:39:29.467469+00:00.