# Cathode — a CRT-phosphor trading workspace with a three.js barrel-lens candlestick renderer

**URL:** <https://discourse.threejs.org/t/cathode-a-crt-phosphor-trading-workspace-with-a-three-js-barrel-lens-candlestick-renderer/92767>\
**Category:** Showcase\
**Tags:** vue, chart, shaders\
**Created:** [July 10, 2026, 5:43pm UTC](https://discourse.threejs.org/t/cathode-a-crt-phosphor-trading-workspace-with-a-three-js-barrel-lens-candlestick-renderer/92767 "2026-07-10T17:43:15Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![BradyHouse](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/bradyhouse/32/70337_2.png) [@BradyHouse](https://discourse.threejs.org/u/BradyHouse)\
**Post date:** [July 10, 2026, 5:43pm UTC](https://discourse.threejs.org/t/cathode-a-crt-phosphor-trading-workspace-with-a-three-js-barrel-lens-candlestick-renderer/92767/1 "2026-07-10T17:43:16Z")

</div>

Cathode is an MIT-licensed Vue 3 component library (`@hetalhouse/cathode` on npm) that renders  
trading UI the way a 1980s terminal would have wanted to: phosphor glow, scanlines, and true  
barrel curvature.

The three.js core: the candlestick chart is a WebGL scene run through a **custom  
barrel-distortion lens shader** — the same curvature applied across the whole workspace — with  
indicator overlays (Bollinger bands, EMAs), volume bars, and trade markers. A three.js loader  
animation covers panel hydration.

Around it: a curved datagrid, a syntax-colored log feed, and a playable fake terminal  
(`cowsay` included) — canvas/CSS components sharing the CRT theme. Everything is tunable live  
in the demo: a curvature slider (0 = flat, crank it for full fishbowl), scanline/glow toggles,  
and phosphor-green / amber / paper themes.

🔗 Live demo: [cathode — a CRT trading workspace (curved grid · three.js candles · phosphor)](https://bradyhouse.github.io/cathode/)  
📦 npm: [https://www.npmjs.com/package/@hetalhouse/cathode](https://www.npmjs.com/package/@hetalhouse/cathode)  
🧰 Source: [GitHub - hetalhouse/cathode: A curved-screen datagrid for the web. Barrel-distorted columns, CRT aesthetics, more data per viewport. · GitHub](https://github.com/hetalhouse/cathode)

_(video below — the curve slider is the fun part)_

 ![01-workspace-default](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/4/5/455f8119c20fe005678ac7f9cfcd28300142e861.jpeg)

 ![02-candle-phosphor](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/2/0/200fba2bfc6bcf01d945ef30acba230192cdd143.jpeg)
