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:
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?
