Back to skills
Skill

find-sprites

find-sprites

Source visual assets (sprites, icons, tilesets, portraits) for a game or UI-heavy build in a way that yields a coherent, intentional look instead of a debug-console aesthetic. Use this skill when you need art for rooms, entities, UI controls, HP bars, spell icons, status effects, or any other visual element; when the build is failing its UI-quality gate because it looks unintentional; or when you're about to fall back to raw ASCII/text UI. The goal is "looks like someone designed it" — not photorealism, not 1:1 with AAA games, but internally consistent and readable.

find-sprites

Agents left to their own devices tend to ship raw text UI, emoji salad, or inconsistent asset mixtures. This skill exists because the ui-quality gate consistently fails when asset sourcing is treated as an afterthought. Source assets deliberately, in preference order, and commit to one visual direction.

Preference order

Work down this list. Only drop to the next tier if the current tier cannot cover your need.

Tier 1 — Installable icon and sprite packages

Lightweight, well-typed, import cleanly. Best for UI iconography, status effects, resource icons, and action buttons.

Package Use for
lucide-react / lucide UI icons, buttons, controls, status (~1500 icons)
@iconify/react / @iconify-json/* Broadest set — game-icons pack, emojione, twemoji, etc.
@tabler/icons Clean outline style, good for minimalist UI
heroicons Simple outline + solid, Tailwind-friendly

For game iconography specifically, @iconify-json/game-icons (Delapouite/Lorc) is the single highest-leverage install:

npm install @iconify/react @iconify-json/game-icons
import { Icon } from "@iconify/react";
<Icon icon="game-icons:crossed-swords" width={32} />
<Icon icon="game-icons:fire-spell-cast" width={32} />
<Icon icon="game-icons:health-potion" width={32} />

~4000 game-themed icons covering weapons, spells, monsters, resources, status effects. Use this before anything else for room icons, spell icons, enemy representations, and resource bars.

Tier 2 — Web-searched free/open-license art

When you need actual sprites (not icons) — tilesets, character portraits, monster sprites, environment art.

Preferred sources (all free, all permissively licensed — always confirm the specific asset's license before shipping):

  • OpenGameArt.org — CC0 / CC-BY tilesets, sprites, UI packs. Search "dungeon tileset CC0", "roguelike monsters CC0".
  • Kenney.nl — huge, consistent, CC0 asset packs. "1-Bit Pack", "Roguelike/RPG Pack", "UI Pack". Single-author → visual coherence is free.
  • itch.io free assets — filter by "free" and check each asset's license. Often CC0 or CC-BY.
  • Game-icons.net — the web source behind the Iconify pack above. SVG download if you need edits.

Process:

  1. Pick ONE source pack for your core visual direction. Do not mix Kenney's 1-bit with Kenney's top-down pixel — pick one.
  2. Download the pack (or the specific sprites you need) into game/public/assets/sprites/.
  3. Record the source and license in game/public/assets/LICENSES.md:
    - dungeon-tileset/ — Kenney.nl "Roguelike/RPG Pack" — CC0
    - monsters/ — OpenGameArt "Pixel Monster Pack" by <author> — CC-BY
    
  4. Reference assets via static paths: <img src="/assets/sprites/monsters/slime.png" />.

Tier 3 — Generated placeholder art

When you cannot find a matching asset and time is short. Quality ranking:

  • SVG drawn by hand (inline or file) — scales, sharp, themeable via CSS.
  • Canvas-drawn shapes — works for simple top-down tiles, procedural dungeon cells.
  • CSS-styled divs with gradients + borders — good enough for room-type differentiation.
  • Emoji fallback — acceptable for status indicators and small UI accents only. Do NOT build your entire UI out of emoji — it reads as lazy even when consistent.

Tier 4 — Geometric primitives

Solid-colored rectangles, circles, borders. Counts against your UI-quality score even if used intentionally. Only acceptable for background panels or temporary placeholders you will replace before shipping.

Tier 5 — Raw ASCII / text-only

This is a gate failure. Do not ship text-only UI. If you are tempted to, go back to Tier 1 and install the game-icons pack — it takes 30 seconds.

Coherence over polish

One consistent visual direction beats a mix of high-quality assets from different styles. A game built entirely from Kenney's 1-bit pack looks intentional. A game mixing hand-drawn portraits, pixel monsters, and flat-vector UI icons looks broken — even if each individual asset is beautiful.

Before sourcing anything, decide:

  1. Perspective — top-down, side-view, or UI-only?
  2. Fidelity — pixel, vector, or illustrated?
  3. Palette — dark fantasy, bright cartoon, monochrome?

Then source only assets matching those three answers. If a must-have asset doesn't match, either adapt it (recolor, resize) or redraw the rest of your direction to match it.

Licensing

Always check the license. CC0 is the simplest — no attribution required, no restrictions. CC-BY requires attribution (include the author in LICENSES.md). Avoid CC-BY-NC (non-commercial) and CC-BY-SA (share-alike viral) unless you've confirmed your project's distribution model is compatible. Never ship assets of unknown provenance.

Failure modes

  • Mixing styles. Pixel + vector + illustrated = incoherent. Pick one.
  • Installing an icon pack and never using it. The install is the easy part. Actually replace placeholder text with <Icon /> in every UI surface.
  • Downloading a tileset without a license check. Ship-blocker if the license forbids the use.
  • Deferring art to "after mechanics work." The UI-quality gate is scored on what actually ships. An unpolished build with working mechanics still fails the gate.
  • Using emoji as the entire UI. Reads as a debugger, not a game.
Source on GitHub

vendor/get-anything-done/sdk/skills/find-sprites/SKILL.md

Client debug · NEXT_PUBLIC_CLIENT_DEBUG=1
0 lines

No events yet. Window errors, unhandled rejections, and React render errors appear here. Set NEXT_PUBLIC_CLIENT_DEBUG_CONSOLE=1 to mirror console.error / console.warn.