> From [PageWeave Design](https://pageweave-design.pageweave.site) — a working library of design resources for agentic web development. Full index: [llms.txt](https://pageweave-design.pageweave.site/llms.txt) # PageWeave Design Design resources for the agentic web: styles, themes, components, skills, prompts and guides — built for humans, readable by agents. Every page carries a markdown twin; append `.md` to any URL. ## Styles - [Industrial](https://pageweave-design.pageweave.site/styles/industrial.md): The interface as machine — condensed caps, mono data, blueprint grids, functional motion. - [Organic](https://pageweave-design.pageweave.site/styles/organic.md): Brought in from outside — earth tones, blob shapes, grain, unhurried asymmetric layouts. - [Playful](https://pageweave-design.pageweave.site/styles/playful.md): Controlled joy — saturated multi-hue palettes, rounded geometry, springy micro-interactions. - [Luxury](https://pageweave-design.pageweave.site/styles/luxury.md): Scarcity through restraint — deep grounds, one metal, ceremonial spacing, fashion-house type. - [Retro](https://pageweave-design.pageweave.site/styles/retro.md): One decade, quoted fluently — limited inks, halftones, chunky slabs, warm nostalgia. - [Editorial](https://pageweave-design.pageweave.site/styles/editorial.md): Magazine layouts, serif voices, measured whitespace. Print discipline carried to the screen. - [Brutalist](https://pageweave-design.pageweave.site/styles/brutalist.md): Raw typography, exposed structure, high contrast. Honesty of material over decoration. ## Themes - [Daylight Ink](https://pageweave-design.pageweave.site/themes/daylight-ink.md): AAA-contrast baseline — paper white, near-black ink, cobalt links, yellow focus. - [Grove Linen](https://pageweave-design.pageweave.site/themes/grove-linen.md): Unbleached linen, olive ink, sage/terracotta accents. Calm low-chroma organic. - [Maison Noir](https://pageweave-design.pageweave.site/themes/maison-noir.md): Fashion-house dark — blue-black, ivory, champagne metal, zero radius. - [Confetti Pop](https://pageweave-design.pageweave.site/themes/confetti-pop.md): Sticker-shop light — grape ink, watermelon/teal/sun accents, pill fields. - [Terminal Amber](https://pageweave-design.pageweave.site/themes/terminal-amber.md): Control-panel dark — steel neutrals, amber instrumentation, zero radius. - [Sunbeam '70](https://pageweave-design.pageweave.site/themes/sunbeam-70.md): 70s offset print — harvest cream, burnt orange, avocado, sticker-weight borders. - [Paper Press](https://pageweave-design.pageweave.site/themes/paper-press.md): Unbleached parchment, warm-black ink, oxblood accent. Print credibility for long-form. - [Ember Desk](https://pageweave-design.pageweave.site/themes/ember-desk.md): Warm near-black paper, cream ink, persimmon accent. Dark editorial for reading-heavy sites. ## Components - [Masonry Gallery](https://pageweave-design.pageweave.site/components/gallery-masonry.md): CSS-columns masonry gallery with mono caption overlays. - [Closing CTA](https://pageweave-design.pageweave.site/components/cta-banner.md): The closing banner — display headline, single action, generous space. - [Stats Strip](https://pageweave-design.pageweave.site/components/stats-strip.md): A horizontal band of large display numbers with mono captions — proof without charts. - [Status Badges & Kickers](https://pageweave-design.pageweave.site/components/badge-row.md): Badge row — semantic status pills plus the mono kicker pattern for section numbering. - [Site Footer](https://pageweave-design.pageweave.site/components/footer-columns.md): Editorial four-column footer — brand blurb, library links, site links, agent resources. - [FAQ Accordion](https://pageweave-design.pageweave.site/components/faq-accordion.md): Border-collapse FAQ — daisyUI collapse with plus/arrow markers, zero JavaScript. - [Timeline](https://pageweave-design.pageweave.site/components/timeline-milestones.md): Vertical timeline — mono date markers on a hairline spine, display-face event titles. - [Chat Panel](https://pageweave-design.pageweave.site/components/chat-panel.md): daisyUI chat bubbles framed as an agent console — the signature agentic-web element. - [Data Table](https://pageweave-design.pageweave.site/components/table-data.md): Dense data table — mono uppercase headers, hairline rows, right-aligned numerics. - [Contact Form](https://pageweave-design.pageweave.site/components/form-contact.md): Quiet contact form — mono labels, hairline inputs, primary focus ring. - [Pricing Tiers](https://pageweave-design.pageweave.site/components/pricing-tier.md): Three-tier pricing — hairline cards, one primary-highlighted plan, aligned CTAs. - [Specimen Card](https://pageweave-design.pageweave.site/components/card-specimen.md): Library card — index number, title, clamped lede, swatch strip, .md chip. - [Minimal Nav](https://pageweave-design.pageweave.site/components/nav-minimal.md): Sticky minimal header — wordmark, underline-hover links, details-based mobile menu. - [Editorial Hero](https://pageweave-design.pageweave.site/components/hero-editorial.md): Typographic split hero — mono kicker, oversized serif headline, paired CTAs. ## Skills - [Design System from Reference](https://pageweave-design.pageweave.site/skills/design-system-from-reference.md): Turn a style reference into a complete, AI-consumable design system: tokens JSON, CSS variables, markdown spec, and visual preview — ready for consistent code generation. - [Design Review & Critique](https://pageweave-design.pageweave.site/skills/design-review-critique.md): Run systematic design reviews: Nielsen's heuristics, visual hierarchy scoring, accessibility checks, and prioritized fix plans with concrete remedies. - [UX Writing & Microcopy](https://pageweave-design.pageweave.site/skills/ux-writing-microcopy.md): Write clear, actionable microcopy for every UI state: buttons, errors, empty states, onboarding, notifications, and form validation. - [Responsive & Adaptive Layout](https://pageweave-design.pageweave.site/skills/responsive-adaptive-layout.md): Build responsive layouts with fluid grids, container queries, and adaptive patterns that work from 320px to ultrawide — no breakpoint chaos. - [Color Systems](https://pageweave-design.pageweave.site/skills/color-systems.md): Build perceptually uniform color systems in OKLCH — from primitives through semantic roles to dark-mode-safe themes that pass WCAG contrast. - [Typography Systems](https://pageweave-design.pageweave.site/skills/typography-systems.md): Build modular type scales, pair fonts with intent, and create hierarchy through size, weight, spacing, and color — not decoration. - [Design Taste & Anti-Slop](https://pageweave-design.pageweave.site/skills/design-taste-anti-slop.md): Detect and eliminate AI-generated design patterns: purple gradients, centered everything, cream backgrounds, and the sameness that makes interfaces feel machine-made. - [Accessibility Audit](https://pageweave-design.pageweave.site/skills/accessibility-audit.md): Systematic accessibility audits: contrast, keyboard navigation, focus management, ARIA, screen reader semantics, and reduced motion. - [Design Tokens & Systems](https://pageweave-design.pageweave.site/skills/design-tokens-systems.md): Build scalable token architectures — primitives, semantics, component mappings — that make design systems consistent and themeable. - [Animation & Motion](https://pageweave-design.pageweave.site/skills/animation-motion.md): Build UI animations with correct easing, duration, and choreography. Spring physics, scroll-triggered reveals, and reduced-motion safety. - [Markdown-First Site](https://pageweave-design.pageweave.site/skills/markdown-first-site.md): Build websites fully accessible through markdown: .md twins, llms.txt indexes, agenticweb.md, agents_md maintenance loops. - [Component Authoring](https://pageweave-design.pageweave.site/skills/component-authoring.md): Write reusable HTML components in daisyUI semantics — self-contained, theme-aware, documented. - [Theme Crafting](https://pageweave-design.pageweave.site/skills/theme-crafting.md): Author complete custom daisyUI 5 themes for PageWeave — full variable sets, OKLCH color logic, dark-mode safety. - [Interface Design](https://pageweave-design.pageweave.site/skills/interface-design.md): For interface design — dashboards, admin panels, apps, tools, and interactive products. NOT for marketing design (landing pages, campaigns). - [Frontend Design](https://pageweave-design.pageweave.site/skills/frontend-design.md): Guides creation of distinctive, production-grade frontend interfaces that avoid generic 'AI slop' aesthetics. ## Prompts - [SEO + Agent Pass](https://pageweave-design.pageweave.site/prompts/seo-agent-pass.md): One prompt covering SEO metadata, Open Graph, JSON-LD and agent discovery for a whole site. - [Release Discipline](https://pageweave-design.pageweave.site/prompts/release-workflow.md): The shipping ritual for PageWeave sites: dev preview, dry-run, release, attach, verify. - [Markdown Retrofit](https://pageweave-design.pageweave.site/prompts/markdown-retrofit.md): Retrofits markdown accessibility onto an existing PageWeave site: twins, llms.txt, agenticweb.md. - [Accessibility Audit](https://pageweave-design.pageweave.site/prompts/accessibility-audit.md): Runs a structured WCAG audit on a page and returns prioritized, concrete fixes. - [Component Extraction](https://pageweave-design.pageweave.site/prompts/component-extraction.md): Extracts repeating patterns from an existing page into documented, theme-safe components. - [Redesign Critique](https://pageweave-design.pageweave.site/prompts/redesign-critique.md): A critique-first prompt: audit an existing page against craft principles before touching anything. - [Craft a Custom Theme](https://pageweave-design.pageweave.site/prompts/craft-custom-theme.md): Generates a complete custom daisyUI theme from a mood description, with contrast checks. - [Build a Landing Page](https://pageweave-design.pageweave.site/prompts/build-landing-page.md): A complete prompt for generating a single-page marketing site with an agent — includes aesthetic direction, section plan, and honesty rules. ## Guides - [Accessibility Baseline](https://pageweave-design.pageweave.site/guides/accessibility-baseline.md): The minimum bar every PageWeave site clears before ship: contrast, keyboard, semantics, motion. - [SEO for Agents](https://pageweave-design.pageweave.site/guides/seo-for-agents.md): Meta tags, Open Graph, structured data — and how agent discovery complements classic SEO. - [Environments & Releases](https://pageweave-design.pageweave.site/guides/environments-releases.md): The shipping model: dev previews, immutable releases, dry-runs, and rollback discipline. - [Markdown Accessibility Patterns](https://pageweave-design.pageweave.site/guides/markdown-accessibility.md): Concrete patterns for serving humans and agents from one source: twins, indexes, and verification. - [Tables as CMS](https://pageweave-design.pageweave.site/guides/tables-as-cms.md): The table-driven content pattern: schema design, CSV imports, template pages, and draft workflows. - [Liquid Cookbook](https://pageweave-design.pageweave.site/guides/liquid-cookbook.md): Practical Liquid patterns for PageWeave: filtered loops, pagination, markdownify, and the traps that bite. - [daisyUI Theming Masterclass](https://pageweave-design.pageweave.site/guides/daisyui-mastery.md): Getting the most from daisyUI 5 on PageWeave — component selection, overrides, and the utility bridge. - [Composition & Backgrounds](https://pageweave-design.pageweave.site/guides/composition-backgrounds.md): Spatial grammar: asymmetry with intent, grid-breaking elements, and backgrounds built in layers. - [Motion Choreography](https://pageweave-design.pageweave.site/guides/motion-choreography.md): Orchestrated motion: one load sequence, purposeful micro-interactions, and reduced-motion discipline. - [Color in OKLCH](https://pageweave-design.pageweave.site/guides/oklch-color.md): Why OKLCH changes how you choose colors, and how to build palettes that survive dark mode. - [Typography Systems](https://pageweave-design.pageweave.site/guides/typography-systems.md): Building type scales that carry personality — pairing logic, size systems, and the details that separate set type from default type. - [The Core Rules](https://pageweave-design.pageweave.site/guides/core-rules.md): The non-negotiables of designing on PageWeave — daisyUI semantics, characterful type, and the death of generic AI aesthetics. ## Collections - [Agent Toolkit](https://pageweave-design.pageweave.site/collections/agent-toolkit.md): Installable skills and runnable prompts covering design thinking, theming, accessibility audits and shipping discipline. - [Launch-Ready Landing](https://pageweave-design.pageweave.site/collections/launch-ready-landing.md): The marketing-site kit: structure prompt, hero/pricing/CTA components, playful or editorial themes, plus the critique loop that keeps it honest. - [Dark Editorial Starter](https://pageweave-design.pageweave.site/collections/dark-editorial-starter.md): A complete starting stack for essays, journals and agent-facing documentation: theme, type system, components and the workflow guides. ## For agents - Index: [/llms.txt](https://pageweave-design.pageweave.site/llms.txt) - Capabilities: [/agenticweb.md](https://pageweave-design.pageweave.site/agenticweb.md) - Any page: append `.md` or send `Accept: text/markdown`