Digital E-Guide Skill
SkillMediadigital-eguide is a skill that lets an AI agent build a two-page e-guide preview as a single self-contained HTML file. Page one is a styled cover with title, author, stats, and a table of contents; page two is an inside spread with lesson body, pull-quote, and step list. It suits lifestyle and creator-brand briefs.
Available today. Use it from your connected AI after setup.
No other account needed.
Have a design system with color, typography, layout, and components sections available, such as a DESIGN.md file.
Then ask your AI: use the Digital E-Guide Skill skill
What your AI can do with it
- Builds a cover page with display title, author byline, stat row, and a two-column table of
- Builds an inside spread with chapter eyebrow, two-column body, and a numbered step list
- Adds a script-aware pull-quote with attribution, styled per Latin, Arabic, Persian, Urdu,
- Picks serif display, body serif, and mono tokens from the active design system
- Includes an EXERCISE callout strip and page footers on the spread
- Outputs one self-contained HTML file and checks its own work against the styling rules
Getting started
- Have a design system with color, typography, layout, and components sections available, such as a DESIGN.md file.
- Make sure the skill is installed so the agent can trigger it on briefs mentioning e-guides, lookbooks, lead magnets, playbooks, or similar.
- Give the agent a brief with a topic, a title or enough context to generate one, and an author byline.
- Ask for the e-guide preview and open the resulting single HTML file to review both pages.
What this skill tells your AI
The instructions your AI receives, as published by nexu-io/open-design in design-templates/digital-eguide/SKILL.md and read by ahel’s review.
Produce a two-page digital guide preview side-by-side. Cover on the inline-start, inside spread on the inline-end. Lifestyle creator tone, lots of negative space, serif display headings, careful column rhythm.
Workflow
- Read the active DESIGN.md (injected above). Pick a serif display token for the title (italic ligatures encouraged), a body serif for long-form, and a mono token for stats / labels.
- Pick the topic + author from the brief. Generate a real title (e.g. "The Creator's Style & Format Guide"), a real subtitle, and a one-line author byline.
- Layout — center two pages on a tinted backdrop:
- Page 1 — cover:
- Eyebrow ("STYLE & FORMAT GUIDE FOR CREATORS").
- Display title with mixed weights and one italic flourish word
("The Creator's Style & Format guide" —
&andguideitalic). - 3-cell stat row ("16 PRINCIPLES OF STYLE", "38 DOS & DON'TS",
"1 BLOCK, ZERO TEMPLATES") in mono, separated by
·. - "What's inside" header with a 2-column TOC (chapters + page numbers in mono, leader dots).
- Footer: "FIND YOUR VOICE" + page 01 mono.
- Subtle decorative dot or sticker (CSS) in a corner.
- Page 2 — spread:
- Eyebrow with chapter number + name ("CHAPTER 02 · TONE").
- Display sub-title ("Write like you talk — only sharper.").
- 2-column body: opening paragraph + a numbered 4-step list ("01 Pick the rule", "02 Drop the filler"…).
- Pull-quote pinned to inline-end: for Latin scripts use large italic display and accent color; for Arabic, Persian, and Urdu use regular or light emphasis (no italics); for Hebrew use regular or light emphasis (no italics). Include attribution. (script-aware)
- Bottom strip with "EXERCISE" callout (mono label + 1 sentence prompt in italic).
- Footer: chapter title + page 18 mono.
- Page 1 — cover:
- Write a single HTML document:
<!doctype html>through</html>, CSS inline.- Pages are 600×860 paper-tone cards with 6px shadow, slight rotation opposing each other (±0.6deg) for a magazine-on-desk feel.
data-od-idon cover, spread, toc, pull-quote, exercise.
- Self-check:
- Type hierarchy is editorial — title owns page 1, sub-title owns page 2.
- Italic accent appears once per page.
- Mono used only for labels, stats, and TOC numbers.
Output contract
Emit between <artifact> tags:
<artifact identifier="eguide-slug" type="text/html" title="E-Guide — Title">
<!doctype html>
<html>...</html>
</artifact>
One sentence before the artifact, nothing after.
Signals
- GitHub stars
- 98k
- Forks
- 11k
- Last commit
- Sep 2026
Others that do the same job
Questions
- When should the agent use this skill?
- When the brief asks for an e-guide, digital guide, lookbook, lead magnet, creator guide, playbook, PDF guide, or 电子指南. It produces a two-page preview rather than a full publication.
- What does the output look like?
- A single self-contained HTML file showing two pages side by side on a tinted backdrop: the cover on the inline-start and the inside spread on the inline-end.
Advanced
- Item type
- skill
- Key
digital-eguide-2- Source
- github.com/nexu-io/open-design