A focused vocabulary for clear communication
Clodsite pages are assembled from typed components. Each component owns its schema, template, and styles. Agents choose from the catalog; validation keeps every plan inside the supported vocabulary.
This is less flexible than arbitrary HTML by design. Constraints make plans easier to generate, review, test, and render consistently.
The component catalog today
Content & sections
| Component | Purpose |
|---|---|
prose |
Headings, paragraphs, lists, links, tables, quotes, and code in GitHub Flavored Markdown |
hero |
A page-opening statement with an optional eyebrow, actions, and one image |
feature-grid |
Two to six features or benefits |
key-facts |
Two to six prominent values with labels and supporting detail |
quote |
A single emphasized quotation with attribution |
faq |
Native disclosure sections for common questions |
resource-cards |
One to six linked project, resource, or next-step cards |
call-to-action |
A focused closing prompt with one or two actions |
Media
| Component | Purpose |
|---|---|
media-section |
One image paired with prose in a constrained responsive layout |
gallery |
A responsive image grid with alt text and optional captions |
Forms
| Component | Purpose |
|---|---|
mailto-form |
A zero-backend form that opens the visitor's email client |
resend-form |
Server-backed email delivery with validation and optional Turnstile protection |
Commerce
| Component | Purpose |
|---|---|
catalog |
A display or checkout product catalog, with optional images, size labels, variants, and size guides |
personalized-product |
A made-to-order product, customized per buyer |
certificate-award |
An issued, verifiable certificate flow |
Assets live with each site. Themes and shared infrastructure live with Clodsite. Building one site never changes another. Current built-in themes are minimal, professional, bold, and warm.
Frequently asked questions
Is Clodsite a website builder or a compiler?
It is a small website compiler. A human or AI agent writes a reviewable build-plan.yaml, and Clodsite deterministically turns that plan into a deployed site.
Who is Clodsite for today?
Today it is for technically capable builders and AI agents creating sites for makers, small businesses, clubs, projects, and experiments.
Do I have to use Claude Code?
No. Clodsite began as a Claude Code workflow, but the contract is build-plan.yaml. Claude, Codex, another agent, or a text editor can produce the plan.
How should an agent use Clodsite?
An authoring agent should read docs/agent-authoring.md and components/CATALOG.md, write or revise build-plan.yaml, validate it, build it, and deploy only after approval.
Can I edit the generated HTML or CSS?
Generated files are compiler output. The normal editing surface is build-plan.yaml, plus typed components and themes when the vocabulary itself needs to grow.
Is Clodsite a hosted multi-tenant platform?
Not yet. It is currently a local, single-operator workflow. Multi-tenant hosting requires stronger per-site credential and trust-boundary isolation.
The whole site lifecycle
Clodsite does more than emit HTML.
| Capability | What it provides |
|---|---|
| Validate | A strict, inspectable contract before work begins |
| Build | Script-generated templates and an Eleventy static site |
| Preview | A local site for review before deployment |
| Deploy | A Cloudflare Pages project and production URL |
| Sell | Stripe checkout, webhooks, and fulfillment, with order records in durable storage |
| Protect | Resend secrets and optional managed Turnstile widgets |
| Connect | Custom-domain association and DNS automation |
| Observe | Local and deployed site status in one view |
| Remove | Explicit teardown of Pages projects and deployment history |
Proven on real projects
Clodsite grew out of building small, real websites where the same pattern kept appearing: a little work required interpretation, while most of the build and deployment work should have been repeatable.
- danrevel.com explores a personal, editorial site with structured image-and-prose layouts.
- Master Time Waster helped shape the original static-site workflow.
- Big Beautiful Peace Prize runs in production with verifiable certificates and personalized prints — forms, Functions, and commerce together.
- HMC Cycling is a planned port that keeps Clodsite honest about the practical needs of community informational sites.
Each shipped project expands the vocabulary while keeping the build contract understandable. Planned ports keep the roadmap grounded in real sites rather than abstract feature ideas.