# Send Theme Factory to your agent Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually. ## Fast path - Download the package from Yavira. - Extract it into a folder your agent can access. - Paste one of the prompts below and point your agent at the extracted folder. ## Suggested prompts ### New install ```text I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Then review README.md for any prerequisites, environment setup, or post-install checks. Tell me what you changed and call out any manual steps you could not complete. ``` ### Upgrade existing ```text I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Then review README.md for any prerequisites, environment setup, or post-install checks. Summarize what changed and any follow-up checks I should run. ``` ## Machine-readable fields ```json { "schemaVersion": "1.0", "item": { "slug": "theme-factory", "name": "Theme Factory", "source": "tencent", "type": "skill", "category": "效率提升", "sourceUrl": "https://clawhub.ai/wpank/theme-factory", "canonicalUrl": "https://clawhub.ai/wpank/theme-factory", "targetPlatform": "OpenClaw" }, "install": { "downloadUrl": "/downloads/theme-factory", "sourceDownloadUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=theme-factory", "sourcePlatform": "tencent", "targetPlatform": "OpenClaw", "packageFormat": "ZIP package", "primaryDoc": "SKILL.md", "includedAssets": [ "README.md", "SKILL.md", "themes/sunset-boulevard.md", "themes/tech-innovation.md", "themes/arctic-frost.md", "themes/modern-minimalist.md" ], "downloadMode": "redirect", "sourceHealth": { "source": "tencent", "slug": "theme-factory", "status": "healthy", "reason": "direct_download_ok", "recommendedAction": "download", "checkedAt": "2026-05-01T11:35:06.898Z", "expiresAt": "2026-05-08T11:35:06.898Z", "httpStatus": 200, "finalUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=theme-factory", "contentType": "application/zip", "probeMethod": "head", "details": { "probeUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=theme-factory", "contentDisposition": "attachment; filename=\"theme-factory-1.0.0.zip\"", "redirectLocation": null, "bodySnippet": null, "slug": "theme-factory" }, "scope": "item", "summary": "Item download looks usable.", "detail": "Yavira can redirect you to the upstream package for this item.", "primaryActionLabel": "Download for OpenClaw", "primaryActionHref": "/downloads/theme-factory" }, "validation": { "installChecklist": [ "Use the Yavira download entry.", "Review SKILL.md after the package is downloaded.", "Confirm the extracted package contains the expected setup assets." ], "postInstallChecks": [ "Confirm the extracted package includes the expected docs or setup files.", "Validate the skill or prompts are available in your target agent workspace.", "Capture any manual follow-up steps the agent could not complete." ] } }, "links": { "detailUrl": "https://openagent3.xyz/skills/theme-factory", "downloadUrl": "https://openagent3.xyz/downloads/theme-factory", "agentUrl": "https://openagent3.xyz/skills/theme-factory/agent", "manifestUrl": "https://openagent3.xyz/skills/theme-factory/agent.json", "briefUrl": "https://openagent3.xyz/skills/theme-factory/agent.md" } } ``` ## Documentation ### Theme Factory Apply consistent, professional styling to any artifact using curated themes with color palettes and font pairings. ### When to Use Styling slide decks, reports, or documents with a cohesive visual identity Applying color palettes and font pairings to HTML pages or landing pages Choosing a pre-built theme for quick professional styling Creating a custom theme when none of the presets fit ### Step 1: Present Available Themes Show the user the 10 available themes with their descriptions: #ThemeVibeBest For1Ocean DepthsProfessional, calming maritimeCorporate, financial, consulting2Sunset BoulevardWarm, vibrant energyCreative pitches, marketing, events3Forest CanopyNatural, grounded earth tonesEnvironmental, sustainability, wellness4Modern MinimalistClean, contemporary grayscaleTech, architecture, design showcases5Golden HourRich, warm autumnalHospitality, lifestyle, artisan brands6Arctic FrostCool, crisp precisionHealthcare, technology, clean tech7Desert RoseSoft, sophisticated dusty tonesFashion, beauty, interior design8Tech InnovationBold, high-contrast modernStartups, software launches, AI/ML9Botanical GardenFresh, organic vibrancyFood, garden, natural products10Midnight GalaxyDramatic, cosmic depthEntertainment, gaming, luxury brands ### Step 2: Get User Selection Ask which theme to apply. Wait for explicit confirmation before proceeding. ### Step 3: Apply the Theme Read the selected theme file from themes/ directory Apply colors and fonts consistently throughout the artifact Ensure proper contrast and readability Maintain the theme's visual identity across all pages/slides ### Theme File Structure Each theme in themes/ follows this format: # Theme Name Description of the visual mood and inspiration. ## Color Palette - **Primary Dark**: \`#hex\` — Usage description - **Accent**: \`#hex\` — Usage description - **Secondary**: \`#hex\` — Usage description - **Light/Background**: \`#hex\` — Usage description ## Typography - **Headers**: Font family - **Body Text**: Font family ## Best Used For Context and audience descriptions. ### Slide Decks Background: Use the primary dark color for title slides, light color for content slides Headers: Apply the header font in the accent color Body text: Use the body font in the primary dark color on light backgrounds Accents: Use accent/secondary colors for charts, highlights, dividers ### HTML / Landing Pages :root { --theme-primary: #hex; /* From theme's primary dark */ --theme-accent: #hex; /* From theme's accent color */ --theme-secondary: #hex; /* From theme's secondary */ --theme-bg: #hex; /* From theme's light/background */ --theme-font-heading: "Theme Header Font", sans-serif; --theme-font-body: "Theme Body Font", sans-serif; } ### Documents / Reports Cover page: Primary dark background with light text Section headers: Accent color with header font Body: Body font on light background Charts/tables: Use accent and secondary for data series Callout boxes: Secondary color as background with primary text ### Creating a Custom Theme When no preset fits, generate a custom theme: Gather input — Ask about the brand, audience, mood, and context Select palette — Choose 4 colors that form a cohesive palette: One dark anchor color (backgrounds, text) One primary accent (emphasis, CTAs) One secondary accent (supporting elements) One light/neutral (backgrounds, whitespace) Pair fonts — Choose complementary heading and body fonts: Heading: distinctive, personality-driven Body: readable, clean Validate contrast — Ensure WCAG AA compliance for text on backgrounds Name the theme — Give it an evocative name describing the visual feeling Document — Write a theme file matching the standard format Review — Show the theme for approval before applying ### Palette Harmony Rules Complementary: Colors opposite on the wheel (high contrast) Analogous: Colors adjacent on the wheel (harmonious) Triadic: Three evenly spaced colors (vibrant but balanced) Split-complementary: Base + two colors adjacent to its complement (versatile) ### Contrast Guidelines Ensure readability when applying any theme: CombinationMinimum RatioWCAG LevelBody text on background4.5:1AALarge text (18px+) on background3:1AAUI components / borders3:1AAEnhanced readability7:1AAA Test accent colors against both light and dark backgrounds before finalizing. ### Available Themes All theme definitions are in the themes/ directory: themes/ocean-depths.md themes/sunset-boulevard.md themes/forest-canopy.md themes/modern-minimalist.md themes/golden-hour.md themes/arctic-frost.md themes/desert-rose.md themes/tech-innovation.md themes/botanical-garden.md themes/midnight-galaxy.md ### NEVER Do Apply a theme without confirmation — always get explicit user selection Mix colors from different themes — each theme is a cohesive unit Ignore contrast ratios — readability trumps aesthetics Use accent colors for large text blocks — accents are for emphasis only Skip font pairing — headers and body fonts must complement each other Hardcode theme values — use CSS variables for easy theme switching ### Related Skills design-system-patterns — Token architecture and theming infrastructure distinctive-design-systems — Aesthetic documentation and unique visual identity ## Trust - Source: tencent - Verification: Indexed source record - Publisher: wpank - Version: 1.0.0 ## Source health - Status: healthy - Item download looks usable. - Yavira can redirect you to the upstream package for this item. - Health scope: item - Reason: direct_download_ok - Checked at: 2026-05-01T11:35:06.898Z - Expires at: 2026-05-08T11:35:06.898Z - Recommended action: Download for OpenClaw ## Links - [Detail page](https://openagent3.xyz/skills/theme-factory) - [Send to Agent page](https://openagent3.xyz/skills/theme-factory/agent) - [JSON manifest](https://openagent3.xyz/skills/theme-factory/agent.json) - [Markdown brief](https://openagent3.xyz/skills/theme-factory/agent.md) - [Download page](https://openagent3.xyz/downloads/theme-factory)