LED Wall Test Pattern Generator

→ Live page

A browser-based test pattern generator for LED video walls. Cabinet maps, screen/port maps, pixel 1:1 checks, colour bars, low-grey ramps, motion/refresh tests, geometry and an ID slate — all rendered at the wall's native resolution, exportable as PNG, MP4 or a PNG sequence.

One self-contained HTML file. No build step, no dependencies, nothing loaded from a CDN.

Hosting

It is a single self-contained HTML file. No build step, no dependencies, no server-side anything. Drop index.html at the root of any static host:

• Netlify / Cloudflare Pages / Vercel — drag the unzipped folder onto the deploy area, or point it at the repo with no build command and the folder as the publish directory.
• GitHub Pages — commit the folder, enable Pages on the branch, done.
• Any web server — copy index.html into the document root.

Nothing is fetched from a CDN, so it works offline and behind a locked-down show network once the page has loaded. Serve it over HTTPS if you can: the clipboard API behind "Copy setup link" and the Fullscreen API both prefer a secure context.

_headers is a Netlify/Cloudflare Pages convention and is harmless on other hosts; delete it if your host complains.

Running it locally instead

Open index.html directly in a browser. Two things behave differently from file://: some browsers disable localStorage there, so settings may not persist between sessions (use Copy setup link and bookmark the URL instead), and the WebCodecs encoder needs a secure context. If the encoder dropdown shows WebCodecs as unavailable, serve the folder over localhost instead:

python3 -m http.server 8731 --directory .

then open http://localhost:8731. Hosted over HTTPS, neither caveat applies.

Using it

1. Set the canvas to the exact pixel resolution of the wall, and either enter the pixel pitch or let it be calculated (see below). The note shows physical size, area and diagonal so you can sanity-check against the drawing.
2. Set the cabinet and module sizes. The notes derive cabinet mm, modules per cabinet and port count, and turn red if the canvas isn't a whole number of cabinets or the cabinet isn't a whole number of modules.
3. Pick a pattern, adjust its options.
4. Output window → drag it to the display feeding the processor → press F for fullscreen. Or Export PNG and load the file into the media server.

Terminology

The tool keeps these separate because faults sit at different levels:

Term	What it is
Screen	the whole wall — the canvas you're generating for
Controller / sending card	the processor driving the screen; has several output ports
Output port	one Gigabit (or 10G) link out of the controller, feeding a run of cabinets
Cabinet	the enclosure: one receiving card, one power supply, a frame, and several modules. The unit a port is wired to, and the unit that gets rigged
Receiving card	inside the cabinet; takes the port's data and drives the modules via a hub board. One per cabinet
Module	an LED PCB inside the cabinet. The smallest field-replaceable part, so the granularity most faults sit at
Pixel pitch	distance in mm between LED centres

"Panel" and "tile" get used for both cabinets and modules depending on who's talking, so neither appears anywhere in this tool.

A worked example, the most common rental build: a 500 × 500 mm cabinet holds four 250 × 250 mm modules in a 2 × 2. At P3.91 that cabinet is 128 × 128 px and each module is 64 × 64 px; at P2.5 the same cabinet is 200 × 200 px with 100 × 100 px modules.

The tool derives modules per cabinet and flags it in red when a cabinet isn't a whole number of modules.

Millimetres, pixels and pitch

Canvas, cabinet and module each have a px box and a mm box side by side. Any two of millimetres, pixels and pitch give the third, and the mm solves for toggle says which of the three the mm boxes should work out.

Solve for Pitch (default) — working off a spec sheet. A px box sets resolution, a mm box sets the pitch:

Enter	Get
Cabinet 128 px + 500 mm	pitch 3.90625 mm — P3.91
Cabinet 200 px + 500 mm	pitch exactly 2.5 mm

Every other mm box updates to match, so the module figure falls out without you calculating anything. And because width and height each imply their own pitch, a pair that disagrees — 500 mm / 200 px across but 480 mm / 200 px down — raises a warning that the pixels would not be square. That's nearly always a spec-sheet typo, and much cheaper to catch at a desk.

Solve for Pixels — planning a build. The pitch stays put and a mm box sets the pixel count instead:

Enter	Get
Screen 6000 mm at 2.5 mm	2400 px — 12 cabinets of 500 mm
Cabinet 500 mm at 2.5 mm	200 px
Module 250 mm at 2.5 mm	100 px

A dimension that doesn't divide evenly rounds to the nearest whole pixel and the mm box corrects itself so you can see what you actually got — 6101 mm becomes 2440 px, which is 6100 mm.

Snap canvas to whole cabinets rounds the canvas to the nearest whole cabinet count in both axes, since that's how a wall is really sized — 2440 × 1240 becomes 2400 × 1200, exactly 12 × 6 cabinets.

Why it matters on site. A dead cabinet is a black rectangle with a receiving card or a power supply behind it. A dead module is a smaller black rectangle inside an otherwise working cabinet, and it's a different fix. Set Number by → Module on the Cabinet Map and every module is labelled M1–M4 with its parent cabinet underneath, so a fault can be called in as "M3 in R2C3" rather than "somewhere in the third cabinet". Module outlines are also available as an overlay on top of any other pattern — useful over a solid field or a low-grey ramp, where module-to-module brightness and colour differences show up.

Advanced · screen map

By default the tool assumes one data chain, chunked every n cabinets. Tick Assign controller output ports to build a real screen map instead: each output port owns a rectangle of cabinets and runs its own wiring order inside it, the way you'd configure it in NovaLCT or the controller's own screen-configuration page.

Split lays ports out automatically — across × down, in ports. 4 × 1 is four vertical strips, 1 × 4 four horizontal bands, 2 × 2 a quad. Cabinets divide as evenly as they can. From there, edit any port by hand: position, size, name, colour, and its own wiring order and start corner.

You can also work on the preview directly. Click a cabinet to select the port feeding it; drag across the preview to redraw the selected port's region, snapping to cabinet edges.

Port capacity sets the pixel budget per port — 650,000 for a NovaStar-style Gigabit port, 655,360 for Colorlight, or whatever your controller does. Each port shows its cabinet count, pixel count and percentage of that budget, and turns red over 100%. This is the quickest way to find out a wall needs eight ports rather than four before you're standing in front of it.

It continuously checks the map and reports:

• cabinets no port feeds
• cabinets claimed by two ports (the later port loses)
• port regions running off the canvas
• ports over their pixel budget

The Port Map pattern renders the result: each port in its own colour, the data path drawn through its cabinets in wiring order — square marker where data enters, arrow where it leaves — port boundaries, and per-cabinet sequence numbers. Anything unassigned is hatched in red. Put it on the wall and you can see at a glance whether the physical cabling matches the plan.

The map also drives the Cabinet Map pattern: with it on, P1·01 style labels and the colour-by-port fill use the real port assignment rather than the simple chunking.

Regions are rectangular, which covers the overwhelming majority of screen configurations. An irregular wall is best handled as several rectangular ports.

The one thing that matters

If the status bar does not read 100% 1:1, the wall is seeing a scaled image and every pixel-level pattern is lying to you. Match the source output resolution to the canvas and disable scaling in the processor before you trust anything.

Patterns

Pattern	What it finds
Cabinet Map	dead or swapped cabinets, wrong receiving-card mapping, data-run order — switch to Number by Module to identify a single bad module
Port Map	which controller output feeds which cabinets, and whether the cabling matches the plan
Pixel 1:1	any scaling in the chain, camera moiré
Solid Field	colour cast, uniformity, dead LEDs
Colour Bars	SMPTE with PLUGE for black level, or EBU 100/75
Greyscale	low-grey performance (0–16), gamma, banding
Gradients	per-channel banding and bit depth
Crosshatch	geometry and alignment
Frame & Circle	overscan, aspect ratio, safe areas
Motion	refresh rate, ghosting, smearing, tearing, camera scan lines
Colour Cycle	dead-pixel walk-the-wall inspection
ID Slate	spec on the wall, plus a live clock and frame counter that prove the feed is live and not a frozen frame

Logo layer

Load an image — Load image…, or drop a file straight onto the preview — and it composites into every pattern, every export and every video.

Layer decides where it sits:

• Background — the logo goes down first and the pattern is composited over it with a lighten blend, so the pattern's dark ground drops out and lets the logo through while its bright elements still read. This is the one that behaves like a real background layer, and it works with any of the dark-ground patterns: cabinet map, port map, crosshatch, frame & circle, pixel grid.
• Over the pattern — straight on top, under the grid and clock overlays.
• Top — over the overlays too.

Scale mode is the scaler: Fit (whole logo, aspect kept), Fill (cover), Stretch, Native 1:1, or Tile. On top of that, Scale % is a free multiplier from 1 to 400, so you can fit-then-trim. Position is a nine-point anchor plus an X/Y pixel offset, and the note underneath reports exactly what you're getting — drawn size, origin, and percentage of native — so you can see when you're scaling a logo up past its resolution.

Two switches worth knowing:

• Smooth scaling off switches to nearest-neighbour, which keeps a pixel-art or hard-edged logo crisp instead of mushy. On an LED wall that usually looks better.
• Snap to cabinet grid rounds the logo's position and size to whole cabinets, so it lands on cabinet seams rather than straddling them.

For a plain branded holding plate, use the Solid Field pattern with the logo over it.

The image never leaves the machine. It's deliberately not part of the setup link — that would make the URL enormous — but it is remembered between sessions if it's under about 1.5 MB.

Video export

The animated patterns — cabinet chase, motion, colour cycle, ID slate — can be written out as a file for a media server.

There are two encoders behind the Encoder dropdown.

WebCodecs · H.264 → MP4 (default) drives the browser's hardware encoder directly and writes the MP4 container itself. It runs as fast as the machine allows — several times real time — and the frame timing is exact by construction rather than sampled off a clock. Use this one unless it can't handle your case. It needs:

• a secure context — HTTPS or localhost. Hosted, this is automatic.
• even pixel dimensions, an H.264 requirement. An odd-width canvas is refused with a message rather than silently mangled.
• a resolution the hardware encoder accepts. 4096 × 1152 encodes fine; 10240 × 2880 is beyond what most encoders will take, and the tool says so and points you elsewhere.

The Keyframes setting controls the GOP. Every frame (all-intra) gives a larger file that scrubs and loops perfectly — usually the right choice for a test pattern.

MediaRecorder · real time is the fallback, and what you get if WebCodecs is unavailable. Format options are whatever the browser supports; Chrome and Safari both offer MP4 / H.264. Recording runs in real time (a 10 s clip takes 10 s), but the content is still driven by a fixed frame clock, so the frames themselves are exact regardless of machine load.

If neither encoder is available the buttons disable themselves and say why — the PNG sequence always works.

Fit to loop works out the pattern's natural loop length and snaps the duration to a whole number of loops, so the file cuts back to frame one without a jump. The note under the controls tells you whether the current duration is seamless or will stutter on repeat. Some settings have no clean loop — the travelling box, for instance, has different horizontal and vertical periods — and the note says so.

Switch the live clock and frame counter off before exporting anything that needs to loop; they read real time and will never repeat.

PNG sequence (.zip) writes a numbered, frame-accurate image sequence. This is the route to take when the media server wants an image sequence, or when you need ProRes or HAP — encode the sequence afterwards:

# ProRes 422
ffmpeg -framerate 60 -i LED-TP_motion_4096x1152_%04d.png -c:v prores_ks -profile:v 3 out.mov

# HAP (media-server friendly, cheap to decode)
ffmpeg -framerate 60 -i LED-TP_motion_4096x1152_%04d.png -c:v hap -format hap_q out.mov

# H.264, high quality
ffmpeg -framerate 60 -i LED-TP_motion_4096x1152_%04d.png -c:v libx264 -crf 12 -pix_fmt yuv420p out.mp4

Sequences are held in memory before the zip is written, so it prompts above 900 frames. Long clips are better made as a short seamless loop that the server repeats.

Keyboard

Space pause · E export PNG · V record video · O output window · [ ] previous/next pattern. Inside the output window: F fullscreen, S toggle fit vs. true 1:1.

Notes

• Exported PNGs are untagged sRGB. Disable display colour management on the playback machine or solid fields will not be the values you asked for.
• Photosensitivity: the Motion pattern's Flash mode strobes the full field. Do not run it in front of an audience.
• Copy setup link encodes the entire configuration into the URL, so a wall's exact setup can be bookmarked per job or sent to someone else.