Prismwar: a six-color card game with a built-in AI opponent that runs entirely in the browser

Fri, 11 Sep 2026 03:51:32 +0000

Hey CoderLegion!

I've been building Prismwar, an original trading card game you play against a computer opponent right in the browser. If you've played Magic, the shape will feel familiar: five colors of mana, creatures, spells, deckbuilding. Then there's a sixth color, Purple ("Undertow"), built around disruption.

It's heading for my browser arcade at play.dhseadev.online and for a Chrome extension. Both run the same game, and neither needs an account.

Features:

A 250-card set, "Refraction": 240 collectible cards plus 10 Ascendants, a new permanent type with loyalty and two abilities. Ascendants can't be pulled from packs. They unlock only through redeem codes.
Signed redeem codes: codes are signed with ECDSA P-256. The game can verify a code, but it can't create one, because the signing key never ships with it.
8 starter decks: one for each of the six colors, plus two dual-color decks (White/Red and Green/Blue). They're all commons-only, and so are the AI's decks, so the opponent can't out-rare you.
Tutorial mode for learning the rules.
Fair packs, with the odds shown in-game: slot 4 is guaranteed uncommon or better, slot 5 is rare or better, there's a pity counter for Signature cards, and duplicates are protected. You earn cards a few ways: dust for every finished match, a pack for your first win of the day, and a bonus for win streaks.
Collection and crafting: your collection is grouped by rarity, and you can craft missing cards with dust.
Procedural pixel art for all 250 cards, with no drawn assets: each color has a 5-tone palette, light always comes from the top left, and a card's keywords choose its form (beast, humanoid, flyer, serpent, colossus, wisp). My favorite bug: two unrelated cards had identical art because the effect sigils had no randomness. Now a build gate hashes the geometry of every card and fails if any two match.
Card interactions: click to flip for rules and flavor text, shift-click to enlarge, hover for a quick preview.
Generated music: three styles (ambient, chiptune, synthwave) built live with Web Audio, with intensity that follows the match. There are no audio files at all.
Game feel: particles when cards are cast and screen shake on hits. Sound, music, screen shake and motion each have their own setting, and turning motion off disables the effects.
Backup and restore for your collection.
The Ledger: export your collection progress as a generated PNG card to share, or post it to a shared wall.

Tech Stack:

Vanilla JavaScript, HTML and CSS: no framework
Canvas 2D for card art and the shareable Ledger card
Web Audio API for all sound effects and music
ECDSA P-256 signatures for redeem codes
Chrome Manifest V3 with a single storage permission
Cloudflare Pages for the arcade, and playhtml for the shared Ledger wall
Testing: a Node unit suite, a sabotage suite that must catch deliberately broken builds (15 of them), and a headless Chromium suite that runs under the production Content Security Policy, both from source and from the packaged extension

Status

In final prep, not live yet. Links will go here once it deploys:

More from me: https://dhseadev.online/

I'd love your input

AI-vs-AI testing says the aggressive starters (the White go-wide deck and the Red burn deck) are the strongest right now, and the Green ramp deck and the White/Red deck are the weakest. If you've balanced a card game before, how would you tune commons-only starter decks without flattening what makes each color different?

And if you could design a sixth color from scratch, what would it do?

Shipping Real Audio In A Browser Game Without A Studio Budget

Mon, 24 Aug 2026 12:49:59 +0000

Most of us have shipped something where the audio was the last thing we thought about and the first thing that gave the project away as a side project. This is a walkthrough of what actually changed over the last two years and what it means if you are building a game that runs in the browser.

Where The Constraint Actually Was

Browser games have always had thin audio for two separate reasons, and people usually only talk about one of them.

The first is budget. A single orchestral score runs into five figures. Voice acting a dialogue heavy RPG can double or triple what a small team spends on everything else. So the realistic option was a sound effect library, which produces generic results that every other game using that library also ships with.

The second is file size. Browser games stream their assets over a connection you do not control, so audio got compressed until it was small enough to load and repetitive enough to loop forever. Three tracks and a jump sound was not a taste decision, it was an engineering one.

What The Generators Handle Well

Music generators produce original compositions from a prompt or from parameter controls. Sound effect models generate footsteps on a specific surface, UI clicks and impacts from a written description. Voice synthesis produces character dialogue with emotional inflection and accent control that is hard to distinguish from a recording.

The useful way to split this is by how much attention the asset gets. Ambient and exploration loops, incidental effects and secondary NPC dialogue are the eighty percent nobody consciously notices, and that is where generation is genuinely good now. A main theme that players hum afterwards still comes from a person having an idea, and prompting does not reliably get you there.

The file size problem also softens, because you are generating to your own spec. You choose the length, the quality and the compression rather than accepting whatever the library shipped.

The Web Audio API Side

This is the part that makes it worth doing in a browser specifically. The Web Audio API gives you real time processing, spatial sound and dynamic mixing natively, so generated assets are not just dropped in as static files.

That opens up adaptive music, where layers fade in and out based on game state rather than a track restarting at a hard cut. Combine that with generation and you can produce the stems you need for each layer instead of trying to carve them out of one finished mix. The gap between browser audio and what Unity or Unreal produce on the desktop has narrowed a lot, and this is most of the reason why. The full walkthrough of the tooling and the integration side lives in AI game audio and music if you want the detail.

Licensing Is The Part That Bites

Terms vary wildly between tools, they change, and some free tiers grant far less than people assume, particularly around commercial release and storefront distribution.

Check what your generator actually grants before you build the game around the assets. Unwinding this after release means replacing audio in a shipped product, which is exactly as miserable as it sounds.

The Takeaway

The constraint that kept browser games sounding cheap was real, and it is mostly gone. What replaced it is a licensing question and a taste question: generate the parts nobody notices, keep a human on the parts that carry the identity of the game, and read the terms before you commit.

Coder Legion - Recent posts tagged webaudio