Course style

This skill is the reference layer for the AI Engineering from Scratch look and voice. Other craft skills point here for exact values: blueprint-figure, motion-figure, isometric-explainer, and write-manual. Use it with Claude, Cursor, Codex, OpenClaw, Hermes, or any agent that reads SKILL.md. It holds no drawing method of its own. It tells you which colour, font, label, spacing, and word to use, and how to check each one.

When to use

• You write or review a page, a card, a figure, or a manual for the course.
• You need a token value for light or dark mode.
• You need the label format for a figure, a sub-figure, or a widget.
• You need to check prose against the plain technical English rules.
• You add motion and need the timing, the easing, and the reduced motion behaviour.

When not to use

• You draw a static SVG figure. Use blueprint-figure, which cites this skill.
• You build an animated or slider figure. Use motion-figure.
• You build an isometric machine explainer. Use isometric-explainer.
• You write a full manual. Use write-manual for the structure and the audit.
• The page belongs to a different product with its own brand.

Method

1. Set the theme. Put the light tokens on :root and the dark tokens on [data-theme="dark"]. Copy them from references/tokens.md.
2. Pick the token set. Pages use the site tokens. Manual figures use the --m- tokens.
3. Load the three fonts with the exact link in references/typography.md. Use the stacks as given.
4. Give each figure a label in the format from references/labels-and-layout.md.
5. Build cards and figure frames with the measurements in references/labels-and-layout.md.
6. Add motion only with the motion tokens. Add the reduced motion block from references/accessibility.md.
7. Write the prose. Then check every line against references/plain-english.md.
8. Run the checklist below. Fix each failure before you finish.

Rules

Colour