How does the Struq skill work?
The Struq skill changes the order of the work. Your agent first settles a direction, two typefaces, a colour system and the motion, writes them into one plan and stops once for your approval. Then it builds the site from 44 admitted blocks, runs its own check and fixes what it finds.
Updated
Struq skill 0.5.0
What happens when I type /struq?
Four things, in a fixed order. The only moment it waits for you is the plan.
/struq
You give it a brief
One line is enough. Who it is for, what it should feel like, anything you already have.
It plans, and stops once
The site is planned as one film: a motion language, one idea, one motif and a storyboard of scenes. Then a palette, a type pairing and a photo pack, all in one STRUQ.md that must pass its own check. You approve, and send a logo, photos or real numbers if you have them.
It builds from blocks
Each block is installed with everything it imports. Your agent writes the tokens, the fonts and your real copy around them.
It checks its own work
A check script runs until it passes. With a browser tool the agent also looks at the page at phone and desktop width and fixes what it sees.
What does the skill put on my machine?
Instructions, the block files and five small Node scripts that your agent runs inside your project. Everything ships in the package, so a build needs no account and works offline apart from the photos.
Blocks
44 admitted blocks: 4 preloaders, 3 page transitions, 2 headers, 5 heroes, 3 WebGL backgrounds, 9 showpieces, a scene transition, 15 sections and 2 footers, with the kit they stand on.
Direction
Struq’s palettes and type pairings, written as the one token block the blocks read. It works offline and needs no account.
Photos
Art-directed CC0 packs from the Struq image library, picked by the brief and filtered to what fits the client.
Craft
The rules for the code between the blocks: clips from numbers, whole pixels, decode before show, scroll-tied and reversing motion, and type on the calm side of a photo.
Check
A script that looks for the AI look (eyebrows, pills, gradients, glow, monospace, Inter, default purple, numbered steps, icon grids, dashes) and for what a page owes its blocks. It checks the plan too, before a block goes in.
Icons
Struq Icons by default: 182 two-tone icons, most with their own hover motion.
Which commands are there?
Four. In Codex you write $struq where Claude Code uses /struq, and in Cursor you ask for the struq skill by name.
/struq <brief>
Plans the site into one STRUQ.md, stops once for your approval, builds it, then runs its own check and fixes what it finds.
/struq redesign <path>
Keeps your brand, copy and components, and swaps in blocks where the page is weakest.
/struq audit <path-or-url>
Changes nothing. Returns everything that makes the page look AI-made, each with its fix, and the three changes that pay off most.
/struq direct <brief>
Directed mode, for one continuous 3D experience across chapters.
How does it check its own work?
A check script reads the finished files for the AI look and for what each block needs from the page, and the agent keeps fixing until it passes. With a browser tool it also opens the site at phone and desktop width and repairs what it sees.
The check returns what fails and how to fix it. It never returns a design score.
What does it fetch, and what does it send?
The installer downloads the package from npm, looks for your AI tools and copies the skill into them. It sends nothing.
Blocks and direction are inside the skill. For every photo slot your own images do not fill, a script reads the public pack list of Struq’s photo library and downloads the chosen images into your project; offline it writes plates graded to your palette instead. The finished site links its web fonts from the visitor’s browser, as any site with web fonts does.
Give your AI the direction.
Paste it into Claude Code. It runs the install, then /struq is ready.
The Struq skill is free and open source. No account, no key, nothing to configure. Version 0.5.0, and you update by running it again.