sent here for Seminar
online course template nextjs · React and HTML source
Seminaronline course template Next.js
An online course template Next.js creators can use to show the full learner journey, from choosing a cohort to submitting and revising a critique-ready artifact.
- 68 / 68
- light / dark tokens
- 2
- modes, both designed
- 1
- DOM, rendered twice
- unlimited projects, client work included
- 12 months of updates
- 14 days, no questions
AGENTS.md and 4 skills ship in the zip, so your own agent keeps changing it after you buy.
docs: install, use, customizepages, composed from 13 sections
Every page is a real render from the publish gate, in the mode on show. Open any of them in the live preview.
- Fieldnote: practice the real thing/
- site-header
- hero
- learning-trail
- course-shelf
- cohort-band
- +3
Courses: choose your studio/courses- site-header
- course-index
- cohort-band
- site-footer
Service systems in practice/course- site-header
- course-overview
- learning-trail
- mentor-notes
- cta
- +1
Lesson 03: test the failure/lesson- site-header
- lesson-shell
- learning-trail
- site-footer
Learner studio: continue your work/studio- learner-studio
Mentors: meet your critics/mentors- site-header
- mentor-roster
- mentor-notes
- cta
- site-footer
Components/components- site-header
- hero
- learning-trail
- course-shelf
- cohort-band
- +8
Seminar includes seven routes, thirteen sections, twenty-six primitives, seven original studio images, a canonical Wire Diagram learning trail, course catalog, lesson workspace, learner studio, mentor roster, and a living component guide. The Fieldnote demo stays honest about scope: fixtures and studio actions run in React, not an LMS backend. Both modes use computed AA pairs, every type size and color is token-driven, three OFL variable fonts ship locally, and the runnable zip includes agent workflows for rebranding and extension. Fourteen of the primitives are the shared tt-ui parts — dialog, confirm dialog, menu, popover, tooltip, toast, tabs, date picker, table sort, pagination, toggle group, search, skeleton and disclosure — each with Escape, focus trap, focus return and a real keyboard model, and each skinned entirely in Seminar's own tokens. The seven routes ship again as a framework-free HTML template that runs the same parts in vanilla JavaScript, compiled to standalone documents with local fonts for hosts without a Node build.
sections and primitives
You get the parts, not just the demo site. Every frame is a real capture from the theme's own styleguide page, and the source path under it is where the file lands in your project. 32 frames cover them, with 8 primitives sharing the ui/* frame.
tokens, both modes
Change one variable and every part follows. Each badge is one token split down the middle: its light value on the left, its dark value on the right, with the theme's own paired ink on both halves.
hover or tab a badge for its name and both values, enter copies
The learning trail: a Wire Diagram evidence fork built from square milestone nodes, mentor handoff cards, connector rails and a repair loop
every token
typefaces, self-hosted
Real woff2 files in src/fonts/, wired through next/font and licensed under OFL. Nothing is fetched from Google at build time, so the zip renders these letterforms offline. Scale ratio 1.25.
Seminar
An online course template Next.js creators can use to show the full learner journey, from choosing a cohort to submitting and revising a critique-ready artifact.
const { open, close } = useLedger("2026-03") // 0123456789
- display
- Instrument Sans
- text
- Karla
- mono
- Spline Sans Mono
- captionAg
- smallAg
- bodyAg
- leadAg
- d1Ag
- d2Ag
- d3Ag
- d4Ag
every width is a real render from the publish gate
Four viewports, each one a render the gate produced and checked. Switch between them: the frame narrows exactly as a window does, because that is what it is.
every token and every part on one page
The styleguide route is not documentation about the theme. It is a page in the zip that renders the real components from the real tokens, so it stays true the day you change one.
files in the zip
Two independently authored editions: React for applications, plus ready HTML, CSS and vanilla JavaScript for static hosts.
- AGENTS.mdthe theme's own rules, written for an agent
- .claude/skills/4 skills, each one job
- add-page/SKILL.mdCompose a Seminar route from existing sections and register it in the manifest and marketplace preview without breaking heading, link, or signature rules.
- add-section/SKILL.mdAdd a self-contained Seminar section with semantic tokens, the existing type vocabulary, content-pass copy, manifest wiring, and styleguide coverage.
- check-quality/SKILL.mdVerify Seminar's tokens, type, copy, spine, accessibility, responsive captures, TypeScript, and production build before publishing.
- rebrand/SKILL.mdRebrand Seminar through its light and dark token tables while preserving computed AA, the sage undertone system, and the critique accent role.
- src/
- theme.css68 tokens, light and dark
- fonts.tsthe faces, wired to the type tokens
- app/7 files
- components/14 files
- ui/27 files
- assets/7 images, 1 markdown file, 1 file
- fonts/3 font files, 3 licenses
- app/7 routes, plus layout.tsx and globals.css
- theme.jsonthe manifest: tokens, components, pages
- html/the framework-free edition
- dist/7 compiled routes, deploy-ready — no build step
- src/the Nunjucks source the routes compile from
- scripts/build-html.ts · serve-html.ts — `bun run build:html` / `preview:html`
- README.mdquickstart
- 6 project filespackage.json · tsconfig.json · next.config.ts · postcss.config.mjs · env.d.ts · .gitignore
skills your agent can run
Your agent reads AGENTS.md before it edits, then runs the skill that fits the change. The skills are the theme's own, and the publish gate makes an agent complete every one of them in a scratch copy before the theme goes live.
39 components, 7 pages and 68 tokens, as a Next.js project.
AGENTS.md carries the design spec. Each skill is one job written against it.
Claude Code, Codex, or any agent that reads AGENTS.md. It runs on your machine, on your own account.
Built from the theme's own sections, on the same tokens and the same rhythm.
The source is yours to run, edit and deploy.
The spec ships inside the folder, so the page your agent adds next month is built by the same rules as the ten it came with. Nothing calls back here.
What the free license coversWhat do I actually get?
Does it include the pages I'd otherwise have to build?
Will it work with my stack?
How long before it stops looking like a template?
Can I use it for client work?
activity
- v1.4.0: The catalog's largest gap closes — fourteen parts in both editions
- v1.3.3: Docs cover the HTML edition, including the typeface caveat its stylesheet actually carries
- v1.3.2: Quieter chrome — selection reads from its fill and bold label, fields from their surface, with the whole state ramp reordered behind them
- v1.3.1: The topic pills now filter the catalog for real, with a written empty state, and the single-course route is named for its course
- v1.3: A field family and file input, plus pressed and busy button states that now actually paint
- v1.2: Separate Nunjucks source and framework-free HTML output for every route
- v1.1: Learner studio with canonical fixtures, local submission, critique, schedule and recovery states
- v1.0.0 — cohort learning platform with the learning trail, course library, lesson workspace and mentor routes
- connect course fixtures to a buyer backendplanned
- add instructor review tools when buyer demand supports themplanned
for agents
This listing is also a markdown document and a JSON endpoint. The theme's own agent kit is on the kit and agents plates above.
