Studio UI

v1.12.0

Every shared component, in one place. Standard: Roles/Platform Engineer/UI.md. Review this page in light and dark before changing studio-ui.css.

Buttons and chips
neutralbrand donedraftrejected
App header brand (1.7.0; light and dark banners 1.12.0)

Top left of every Role's app: the banner, 56 px tall. The h1 stays for screen readers, visually hidden, so the image has alt="". With a light and a dark banner, give both and mark them is-light and is-dark: only the one for the current theme shows.

Platform Engineer

v1.12.0
Owner's note (1.4.0)

Sits ABOVE the image and above any readouts — never below, never behind a click. Acceptance test: if a review surface can be completed without the note having been seen, it is wrong. Two variants, because the reader and the decision differ. Renders nothing when there is no note.

chef_idlein review
Owner's note — read this first Apron strings should hang loose, not tied in a bow. Reject anything with a bow.
Checks
✓ 64×64   ✓ transparent   ✗ outline 3 px
Galean walk — judging4 options
Your note Watch the back foot on frame 3 — it slid last time.
✓ loops   ✗ foot slide
No note on this option, so no space taken.
Cards
counter_topto generate
Prompt
Top-down 64×64 kitchen counter, flat colors, 2 px outline, transparent background.
Paste into the image generator.
Reference
Reference sprite
x 128 · y 64
Galean walk, frame 3approved
Checkerboard shows transparency. Debug shows coordinates.
Branding and whole-card drop (1.1.0)
Galean idleGalean
Drop anywhere on this card, or click the box and press Ctrl+V. With no generator chosen the files are kept and marked incomplete, not refused. Drops for 5 s after an upload come here wherever they land.
Upload results Ready
Galean walkanother brief
Upload resultsReady
Fields, drop zone, notices
Drop images herePNG or GIFReady
Heads up: this batch still needs the Owner's generation step.
Upload refused: canvas is 63×64, expected 64×64.
All eight frames pass the height check.
Nothing waiting for review.
Archived requests (3)

Collapsed sections use details/summary.

Reject this image?

Say why; the next prompt learns from it.