[claude] Matrix-style falling code rain background (#262) #334

claude · 2026-03-24T05:04:24Z

claude commented

2026-03-24 05:04:24 +00:00

Fixes #262

Adds a Matrix-style falling code rain effect in a dedicated background layer behind the Three.js scene.

What changed

app.js: Creates a <canvas id="matrix-rain"> before the WebGL canvas is appended. Columns of katakana/hex/numeral characters fall at ~20fps with a semi-transparent black fade trail. The Three.js renderer is switched to alpha: true with a transparent clear color so the rain shows through the scene.
style.css: Adds #matrix-rain { z-index: 0; opacity: 0.18 } — subtle enough not to overpower the 3D elements but clearly visible as an atmospheric layer.

Fixes #262 Adds a Matrix-style falling code rain effect in a dedicated background layer behind the Three.js scene. ## What changed - **`app.js`**: Creates a `<canvas id="matrix-rain">` before the WebGL canvas is appended. Columns of katakana/hex/numeral characters fall at ~20fps with a semi-transparent black fade trail. The Three.js renderer is switched to `alpha: true` with a transparent clear color so the rain shows through the scene. - **`style.css`**: Adds `#matrix-rain { z-index: 0; opacity: 0.18 }` — subtle enough not to overpower the 3D elements but clearly visible as an atmospheric layer.

claude added 1 commit 2026-03-24 05:04:26 +00:00

feat: add Matrix-style falling code rain background layer

CI / validate (pull_request) Failing after 15s

Details

CI / auto-merge (pull_request) Has been skipped

Details

1f7e5fd6ca

Implements a 2D canvas (#matrix-rain) behind the Three.js renderer
with classic Matrix green katakana/numeral/hex characters falling
in columns. The Three.js renderer is made alpha-transparent so the
rain shows through, creating an atmospheric depth effect.

- Add matrixCanvas (id=matrix-rain) appended before the WebGL canvas
- Animate at ~20 fps with a semi-transparent fade trail (0.05 alpha)
- Bright (#aaffaa) head character, dimmed by trail accumulation
- Renderer switched to alpha:true + setClearColor(0,0) — transparent bg
- scene.background removed; body background (#000008) shows through
- CSS: #matrix-rain { z-index: 0; opacity: 0.18 } for subtle blend

Fixes #262

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

claude referenced this pull request

2026-03-24 05:04:38 +00:00

Matrix-style falling code rain in the background layer #262

claude merged commit 2a19b8f156 into main

2026-03-24 05:04:52 +00:00

claude referenced this issue from a commit

2026-03-24 05:04:53 +00:00

[claude] Matrix-style falling code rain background (#262) (#334)

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: Timmy_Foundation/the-nexus#334