sent here for Lull
at a glance: Lull
coworking space template nextjs · React and HTML source
Lullcoworking space template Next.js
Lull is a coworking space template in Next.js and Tailwind CSS for the developer building a site for an independent coworking operator whose visitors tour three spaces to find out which one is quiet enough to think in.
- 85 / 85
- 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 23 sections
Every page is a real render from the publish gate, in the mode on show. Open any of them in the live preview.
- site-header
- rooms-hours
- room-rows
- readings-table
- tour-end
- +1
- site-header
- hero
- quiet-premium
- office-sample
- tour-end
- +1
- site-header
- rooms-hours
- room-rows
- readings-table
- tour-end
- +1
- site-header
- rooms-hours
- room-rows
- readings-table
- tour-end
- +1
- site-header
- rooms-hours
- room-rows
- readings-table
- tour-end
- +1
- site-header
- rooms-hours
- room-rows
- readings-table
- tour-end
- +1
- site-header
- plan-ladder
- plan-policy
- tour-end
- site-footer
- site-header
- office-head
- office-list
- office-terms
- tour-end
- +1
- site-header
- meeting-rates
- room-request
- site-footer
- site-header
- visit-request
- visit-lines
- visit-find-us
- site-footer
- site-header
- rules-line
- rule-list
- hours-table
- how-we-measure
- +2
- site-header
- site-footer
Every room is measured once a month and hung on one decibel line: the quiet Reading Room written small at 34 dB, the Kitchen large at 64 at lunch, the booths measured from outside mid-call. The plans are priced by how far into the quiet they let you sit, the private offices are published with real prices and dated vacancies, meeting rooms carry rates and a request form, tours are requested at a real hour, and the access hours are written once so the site cannot contradict itself. Light and dark, in React and plain HTML, every figure derived from one fixture that refuses a silent room above its ceiling, and no booking engine or member portal pretending otherwise. The demo's readings are invented, so AGENTS.md gives your coding agent the rules and your client the method for measuring their own rooms.
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. 33 frames cover them, with 12 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 sound line: one horizontal axis in dB(A) from 25 to 70, linear, full width inside the measure, with everyday reference levels under it in muted type (30 a bedroom at night, 40 a library, 50 a quiet office, 60 conversation at 1 m, 70 a busy restaurant). Every measured place hangs on a stem of one constant length at its reading, its name in Gloock sized by the reading and a mono meta line with the decibels and the house rule (silent, low voice, calls, talk freely), so the line says where you may talk as well as how loud it is; the place the page is talking about carries the one mulberry dot, stem and underline. Below 768px the axis runs down the left edge. Implemented in src/components/ui/sound-line.tsx with lineAt(), ruleCheck(), labelSize() and the lane solver; derive.ts throws at import on a missing or out-of-range reading, a partial month, a silent room above 40, a low-voice room above 52, a booth above 42 outside mid-call, an inverted plan ladder, an office price that disagrees with its square feet, a status date that is not notice plus 60 days, a crossover sentence that disagrees with the prices and Flex sold above 42. It recurs on /, /rooms, /memberships, /offices, /visit and /house-rules, and is withheld on /meeting-rooms. With no readings it hangs every room at its rule's ceiling, labelled held to.
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.2.
Lull
Lull is a coworking space template in Next.js and Tailwind CSS for the developer building a site for an independent coworking operator whose visitors tour three spaces to find out which one is quiet enough to think in.
const { open, close } = useLedger("2026-03") // 0123456789
- display
- Gloock
- text
- Overpass
- mono
- Overpass 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.mdAdd a route to Lull
- add-section/SKILL.mdAdd a section to a Lull route following the theme's own patterns
- check-quality/SKILL.mdRun Lull's own quality checks locally
- rebrand/SKILL.mdPut a real coworking operator into Lull
- src/
- theme.css85 tokens, light and dark
- fonts.tsthe faces, wired to the type tokens
- app/8 files
- components/23 files
- ui/21 files
- assets/1 markdown file, 1 file
- fonts/3 font files, 3 licenses
- app/12 routes, plus layout.tsx and globals.css
- theme.jsonthe manifest: tokens, components, pages
- html/the framework-free edition
- dist/12 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
Your key goes in TAILTHEMES_LICENSE_KEY, and the registry entry goes in components.json. The snippet is on the docs page.
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.
44 components, 12 pages and 85 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 standard 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.0.0: First release: a coworking space site where every room is measured on one decibel line and plans are priced by quiet, in React and plain HTML
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.
