Origami UI Kit - HUD + Strategy - 22 Screens - Godot, Unity, HTML5

A paper UI for paper games, already running in your engine.

The Origami UI Kit is a complete game UI kit: a full flight HUD, a strategy layer and 22 menu screens in Godot 4, Unity 6 and plain HTML5. Open the project for your engine, press play, and the same screens are already wired up.

It is built as a flying society's folding table. Everything you read is parchment, everything you press is a folded index card, what a flyer reads at speed is pencilled on black card, and every warning is a red rubber stamp. It is warm, matte and quiet, so it sits over bright cut-paper scenery without turning into a dark dashboard.

Play the demo at the top of the page before you buy. Every screen in it ships in the download, in all three engines.

Engines	Godot 4 project · Unity 6 project · HTML5 / CSS / JS kit
Screens	22, the same in all three
Sprites	301, at @1x and @2x, transparent PNG and on a #FF00FF key
Strategy layer	FOLDLINE, a deterministic season of a flying society: a valley map, a mill, crease patterns, rival guilds, trade and the standings
Godot drop-in set	a nine-patch paper panel, folded-card buttons with fold sounds, a tear-strip gauge, a FLIGHT LOG dialogue and a notecard score counter
Flight set	the art of a paper-plane flyer in the same paper: three craft, five worlds, hazards, pickups and a campaign map
Dependencies	none — no plugin, no package manager, no build step for the HTML5 kit

---

Four papers, split by job

The material tells you what a widget is for, and the rule fits in one sentence: if you read it, it is written on parchment; if you press it, it is a folded card; if the flyer reads it flat out, it is pencilled on black card; if it warns, it is stamped.

• Parchment is what you read, compare or plan on: unbleached notepad stock with a ballpoint keyline, ruled lines, a torn top edge, a dog-eared corner and a solid cardstock shadow. Panels, tables, tooltips, inputs, notices, the valley map and the crease patterns are sheets off the pad.
• Folded card is what you press, pick or mark: index card creased once across the middle, its lower half a shade darker. Primary cards are ink-dyed, danger cards are stamp red, a hovered card gets a pencil outline and a pressed card is flattened two pixels into its shadow.
• Slate is black construction card, written in white pencil and yellow crayon and pinned with a brass split pin. The HUD uses exactly two, for the flight card and the dart count.
• Ink is what marks: a red rubber stamp for hazards, the blue editing pencil for information and gold star stickers for the best of anyone.

Colour arrives only as folded kami — the five forms, the guilds' papers, the valley's terrains and the paper grades — and a coloured surface always has a fold and a crease, so colour never reads as a flat fill.

---

The notebook is the navigation

The top of every screen is a notebook's divider tabs: eight folded tabs, each with a stamped number and its name in the pencil hand. The open tab is ink-dyed and its pages are listed underneath. The foot of every screen is the page margin: a ruled strip with a red margin rule carrying the chapter, the fold, the flyer, the seals, the time and the wind.

---

A HUD made of paper

The flyer's card holds a folded paper mask, the name, the level and a ruled XP bar. The objective is a note in the pencil hand with the flight's three legs on grade stickers. The judges' notes are pinned slips under an ink stamp. The valley map is a folded sheet with the course in ballpoint, the legs in the grade code and every flyer as a dot of their guild's paper. Rivals ahead fly white paper flags on pins; the flyer closing behind flies a stamp-red one.

The two slates read P3 NOR +1.2, then Paper, Ink and Lift as pencilled bars; and 32 / 160 paper darts with ten dart pips. The four form cards — Dart, Glider, Crane and Gust — sit on keys Q, E, R and F: white card when ready, ink-dyed when on, faded and refilling from the foot while they cool.

Progress is folded, not filled: the fold steps are five stages of folding a crane, done steps in ballpoint and steps to come in faint pencil. The toggle is a folded flap whose side says off or on before its colour does.

---

The codes are real information

• Grade stickers carry results only: gold with ink figures and a ★ for the best of anyone, blue pencil with white figures and a ✓ for a personal best, a plain sticker for neither.
• Five forms — dart, glider, crane, kite and boat — are folded squares of kami, each with its letter.
• Eleven ink stamps mark notices and messages, each a shape and a word: note, ok, caution, halt, info, wait, void, strike, torn, draft and the finished crane.
• Seals are a rival's attitude: five round seal marks, the number stamped in red.

Every code has a second channel that is not colour — a mark, a letter, a shape or a position — and the guilds carry a line pattern as well as their paper.

---

FOLDLINE: a season in the valley

The strategy layer is FOLDLINE, named for the line a sheet is folded along and the front line of a valley its guilds all want. The turn is a fold: Make the fold advances the same state across every strategy screen — valley claims, the flock's orders, the flight plan, the mill's yields, the folding table, the crease patterns, rival attitudes and the standings.

The valley map is a hex lattice printed on a folded sheet. Its terrains are mulberry, pine, cotton, ridge, town and blank paper, and a hex no one has opened is folded under. A claim is a wash of the guild's paper plus its line on the edges, and the ridges are drawn in the mountain-fold line. Five workshops — paper mill, ink stone, spinning wheel, windmill and seal house — yield Paper, Ink, Thread, Wind and Seals.

The rules are integers and deterministic: the same sheet number plays the same season, fold for fold, in all three engines.

---

22 real screens

The kit covers the whole game shell, not just the HUD. The 22 screens are:

Desk
Unfolding	the fold steps fold one step per log line into a crane, then the notebook opens
Title	the title sheet, the fold steps, your flyer and forms, a slate hung on a string and the last flight
New sheet	the society's register: flyer inputs, guilds, the terms of the flight and the sheet number that seeds the run
Preferences	sliders with a folded-corner grabber, flaps, steppers and an unsaved-changes slip
Flight
In flight	the full HUD described above
Letters	the fold-master's mask, a letter with its sender stamp, and three replies
Slate	a slate to write on: typed lines are written up in white pencil, with the leg marks beside it
Satchel
Fold kit	the craft on its stand, six part slots, stats, a part card and the satchel grid
Paper shop	stock rows, the seals chip, a price tag and the buy card
Techniques	a flyer's skills as round seals in a prerequisite tree
Valley
Valley map	the hex lattice, the fold card, tally cards, the hex card, the key and Make the fold
Flock	flyers and ground crew, the last refold as a Gantt, a flight card with its altitude trace, and orders
Flight plan	eight flyers' legs as form bars on the fold axis, the updraft window and the leg table
Mill
Mill yard	a site plan of six workshops, their states and their yields
Folding table	the society's projects as rows with progress bars, dragged into order
Patterns
Crease patterns	twelve folds in three families across four seasons: sealed, open, folding and learned
Fold order	techniques slotted into wings, body and tail, with the craft's glide profile
Scouting	messengers, questions for a rival workshop and the letters that come back
Guilds
Rival guilds	each guild's paper and line, a dossier, seals for attitude and agreements
Trade	a bargain on a paper balance: level is a fair deal, and the slate says by how much it tips
Standings	the season's sheet with grade stickers, the guilds' meets, an altitude trace and the best legs
Swatch book
Swatch book	every part live: buttons in every state, inputs, bars, notes, notices, the danger dialogue and the kit's code

The demo stands on 16 papercraft scenes made for the kit — layered torn paper, folded hills and a paper sky — and they are part of the download, not screenshots.

---

The paper drop-in set for Godot

The Godot addon also carries a small set built to drop into any game: a 64×64 nine-patch paper panel with 18 px margins and a tiled centre, the folded-card button in normal, hover and pressed states, a pencil-line slider with a folded-corner grabber, and a pencil hand. On top of them sit a paper theme and four ready scenes: a button that creases when pressed and rustles when released, a FLIGHT LOG dialogue with a dashed pencil rule, a tear-strip progress gauge and a notecard score and distance counter. Every texture in the set also ships on a pure #FF00FF key.

---

A flight set to go with it

The art download also carries the art of a paper-plane flyer, drawn in the same paper at game size for a 1920×1080 view. One sheet folds three ways — a dart, a glider and a crane, each at 1x and 3x — and flies through five worlds, each a sky, a wall paper and four layers that repeat for parallax: kraft hills under a ruled sky, sage ridges with paper windmills, a paper mill on graph paper, pinked crags at dusk and lantern-strung peaks at twilight.

In its way stand red paper spikes in four sizes, a newsprint barrier, a pinwheel, a rubber-stamp press and a pair of scissors. Along the way are a fold ring and a crease blueprint for each form, updraft and downdraft chevrons and a finish ribbon, and over it all a campaign map: each world's diorama and a pencil sketch of it, gold and pencil stars, and a crane stamp. Every piece also comes on a pure #FF00FF key, and shapes.json gives each craft's hit box and body outline and each hazard's measures, so the art drops straight into a game's collisions.

---

Retheme the live parts with one value

Every colour and size lives in the token export for the engine you use. Change a guild's paper in CSS, GDScript or C# and its swatch, map claims, flyer dots and map edges follow, because those overlays are white-to-tint. The papers themselves — parchment, card and slate — are textured PNG, so a new look is a new token file and a matching art pass.

---

What's actually in the download

Godot 4 project	a theme addon with the paper drop-in set, token constants, fonts and the 22-screen demo project.
Unity 6 project	uGUI scripts, token constants, prefabs, Resources art, fonts and the demo scene.
HTML5 kit	plain CSS, JavaScript, token exports and the playable 22-screen demo. No framework required.
FOLDLINE rules	the deterministic strategy layer in the three languages, sharing one fixture set.
Sprite atlas	all 301 PNGs at @1x and @2x, transparent and on the #FF00FF key, with slices.json giving the nine-slice borders.
Flight set	the flyer's craft, worlds, hazards, pickups and map pieces, transparent and on the #FF00FF key, with shapes.json giving hit boxes, outlines and anchors.

The parts list

Screens	22
Sprites	301, each at @1x and @2x
Glyphs	50, single-colour and tintable
Tiles	18
Nine-slices	45 surfaces that stretch, plus the twelve button_<kind>_<state> textures
Fixed sprites	176 placed pieces: ink stamps, form cards, grade stickers, seals, fold steps, flaps, flags and pins, portrait frames, the valley map, the craft on its stand, the balance, hexes and workshop signs
Content art	75 drawings of craft parts, tools, techniques, guild marks and diagrams
Portraits	26 folded paper masks
Backdrops	16 papercraft scenes, 1280×720
Flight set	81 images: three craft at two sizes, six pieces for each of five worlds, the hazards in their parts, the pickups, the scroll edge, the drafts and the finish, and the map's pieces
Fonts	Nunito and Patrick Hand, both SIL Open Font License

Parchment — panels, cards, headers, modals, tooltips, pinned notes, the objective note, inputs, wells, slots, ruled rows, bars, setup cards, scouting reports, plans and map sheets.

Folded card — three button kinds in four states, chips, signs, checks, radios, the folded flap, the slider's grabber, form cards, key tags and guild swatches.

Slate — the HUD's two slates and their wells, the large slate, split pins, pencil marks and dart pips.

Ink — eleven ink stamps in two sizes, grade stickers, seals in two sizes, the fold steps and the paper grades.

FOLDLINE — six terrain hexes, overlays for claims, reach, hover, fog and selection, seven guild edge lines, the mountain-fold creases, flyer discs and route markers.

Two things worth knowing

Serve the HTML5 kit over HTTP, not straight off disk. Browser security rules can block masked tint sprites under file://. Any static server is enough.

Use the bundled fonts. Nunito's figures are tabular, so columns of times and scores line up in HTML5, Godot and Unity alike, and Patrick Hand is the pencil hand every title is written in.

---

Also on this shelf

The same 22 screens, the same three engines and the same token names, designed from scratch for other worlds: a neon city in the Cyberpunk Game UI Kit and the end of the world in the Post-Apocalyptic Game UI Kit. They share their widget set and the shape of their API, so what you learn in one carries straight over to the others — but not their look.

---

Licence

Use it in commercial and non-commercial projects, in unlimited titles, with no revenue cap. Modify it as you like. Attribution is appreciated, not required. You may not resell or redistribute the asset itself. The bundled fonts keep their own licence — Nunito and Patrick Hand are both under the SIL Open Font License — and the licence files travel with them.