Measured entry
cultui-lightboard
background-effectliquid-glassmotion on file
A client-side React canvas component that turns uppercase text into a scrolling dot-matrix sign, with configurable colors, density, font, hover behavior, and optional pointer drawing. It ships as a shadcn registry source file, uses browser canvas and animation APIs, and has no declared package dependency beyond the host React setup.



Measured
Every value below was written by the harness on the run that produced the frames above. None of it is derived from the prose.
| Build | OK |
|---|---|
| Mount | OK |
| Console errors | 0 |
| Uncaught page errors | 0 |
| Horizontal overflow | clean at 375, 768, 1440 |
| Axe critical | 0 |
| Axe serious | 0 |
| Axe moderate | 0 |
| Axe minor | 0 |
| Gzip marginal | 19.6 KB (85.0 KB build, 65.4 KB baseline) |
| Bare mode | OK |
| Provider required | NO |
| Demo used | written from the component source API |
Verdict
A credible pick for decorative signage: it builds and mounts cleanly, stays contained across the tested layouts, and needs no extra library. Treat it as visual enhancement, not the sole delivery channel for important copy, and review the duplicated animation scheduling before using many instances.
Use it if
- You need a decorative ticker or announcement sign whose colors and dot density must match a custom theme.
- You want an optional canvas drawing interaction alongside the scrolling message.
- You prefer a self-contained source component with no added runtime package.
Skip it if
- The message carries essential information and must remain available to screen readers or when canvas rendering is unavailable.
- You need broad punctuation, lowercase, or complete numeric font coverage without extending the bundled glyph maps.
- You need strict control over animation work, since the source runs overlapping animation loops and continuously redraws the canvas.
- You need server-only rendering with no client boundary or browser APIs.
Install
| Declared dependencies | none declared |
|---|---|
| Missing on install | none |
| Bare install | builds and mounts without the shadcn-style helpers |
| Provider | no provider required in the harness |
Copy the registry component into a client-capable React project, preserve its client directive, and ensure TypeScript and JSX compilation are configured. No third-party runtime package is declared. Non-shadcn projects do not need shadcn utilities or theme tokens, but must place the file in their own component structure and import it directly.
Source and credit
This page is a review, not a copy. The component source lives with its author and this site does not republish it. Read the license before you use anything.
Author repository
github.com/nolly-studio/cult-uiAlternatives
Other published entries for the background-effect pattern, ordered by what they measured: mounts first, then clean axe scans, then bare-mode passes, then the smaller bundle.
- ruixen-loading-circlegradient-glow
- Renders
- YES
- A11y
- 0
- Gzip
- 17.7KB
- Bare
- pass
- Prov
- NO
- eldora-hacker-backgrounddark-futuristic
- Renders
- YES
- A11y
- 0
- Gzip
- 17.8KB
- Bare
- pass
- Prov
- NO
- ruixen-ripple-circlesgradient-glow
- Renders
- YES
- A11y
- 0
- Gzip
- 17.9KB
- Bare
- pass
- Prov
- NO
- ruixen-dual-tone-rain-backgroundunclassified
- Renders
- YES
- A11y
- 0
- Gzip
- 18.4KB
- Bare
- pass
- Prov
- NO
- ruixen-mouse-sparkunclassified
- Renders
- YES
- A11y
- 0
- Gzip
- 20.6KB
- Bare
- pass
- Prov
- NO
- cultui-edge-blurglassmorphism
- Renders
- YES
- A11y
- 0
- Gzip
- 20.8KB
- Bare
- pass
- Prov
- NO