{
  "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": {
    "downloadMode": "redirect",
    "downloadUrl": "/downloads/theme-factory",
    "sourceDownloadUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=theme-factory",
    "sourcePlatform": "tencent",
    "targetPlatform": "OpenClaw",
    "installMethod": "Manual import",
    "extraction": "Extract archive",
    "prerequisites": [
      "OpenClaw"
    ],
    "packageFormat": "ZIP package",
    "includedAssets": [
      "README.md",
      "SKILL.md",
      "themes/sunset-boulevard.md",
      "themes/tech-innovation.md",
      "themes/arctic-frost.md",
      "themes/modern-minimalist.md"
    ],
    "primaryDoc": "SKILL.md",
    "quickSetup": [
      "Download the package from Yavira.",
      "Extract the archive and review SKILL.md first.",
      "Import or place the package into your OpenClaw setup."
    ],
    "agentAssist": {
      "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
      "steps": [
        "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."
      ],
      "prompts": [
        {
          "label": "New install",
          "body": "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."
        },
        {
          "label": "Upgrade existing",
          "body": "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."
        }
      ]
    },
    "sourceHealth": {
      "source": "tencent",
      "status": "healthy",
      "reason": "direct_download_ok",
      "recommendedAction": "download",
      "checkedAt": "2026-04-30T16:55:25.780Z",
      "expiresAt": "2026-05-07T16:55:25.780Z",
      "httpStatus": 200,
      "finalUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network",
      "contentType": "application/zip",
      "probeMethod": "head",
      "details": {
        "probeUrl": "https://wry-manatee-359.convex.site/api/v1/download?slug=network",
        "contentDisposition": "attachment; filename=\"network-1.0.0.zip\"",
        "redirectLocation": null,
        "bodySnippet": null
      },
      "scope": "source",
      "summary": "Source download looks usable.",
      "detail": "Yavira can redirect you to the upstream package for this source.",
      "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."
      ]
    },
    "downloadPageUrl": "https://openagent3.xyz/downloads/theme-factory",
    "agentPageUrl": "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"
  },
  "agentAssist": {
    "summary": "Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.",
    "steps": [
      "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."
    ],
    "prompts": [
      {
        "label": "New install",
        "body": "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."
      },
      {
        "label": "Upgrade existing",
        "body": "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."
      }
    ]
  },
  "documentation": {
    "source": "clawhub",
    "primaryDoc": "SKILL.md",
    "sections": [
      {
        "title": "Theme Factory",
        "body": "Apply consistent, professional styling to any artifact using curated themes with color palettes and font pairings."
      },
      {
        "title": "When to Use",
        "body": "Styling slide decks, reports, or documents with a cohesive visual identity\nApplying color palettes and font pairings to HTML pages or landing pages\nChoosing a pre-built theme for quick professional styling\nCreating a custom theme when none of the presets fit"
      },
      {
        "title": "Step 1: Present Available Themes",
        "body": "Show the user the 10 available themes with their descriptions:\n\n#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"
      },
      {
        "title": "Step 2: Get User Selection",
        "body": "Ask which theme to apply. Wait for explicit confirmation before proceeding."
      },
      {
        "title": "Step 3: Apply the Theme",
        "body": "Read the selected theme file from themes/ directory\nApply colors and fonts consistently throughout the artifact\nEnsure proper contrast and readability\nMaintain the theme's visual identity across all pages/slides"
      },
      {
        "title": "Theme File Structure",
        "body": "Each theme in themes/ follows this format:\n\n# Theme Name\n\nDescription of the visual mood and inspiration.\n\n## Color Palette\n- **Primary Dark**: `#hex` — Usage description\n- **Accent**: `#hex` — Usage description\n- **Secondary**: `#hex` — Usage description\n- **Light/Background**: `#hex` — Usage description\n\n## Typography\n- **Headers**: Font family\n- **Body Text**: Font family\n\n## Best Used For\nContext and audience descriptions."
      },
      {
        "title": "Slide Decks",
        "body": "Background: Use the primary dark color for title slides, light color for content slides\nHeaders: Apply the header font in the accent color\nBody text: Use the body font in the primary dark color on light backgrounds\nAccents: Use accent/secondary colors for charts, highlights, dividers"
      },
      {
        "title": "HTML / Landing Pages",
        "body": ":root {\n  --theme-primary: #hex;     /* From theme's primary dark */\n  --theme-accent: #hex;      /* From theme's accent color */\n  --theme-secondary: #hex;   /* From theme's secondary */\n  --theme-bg: #hex;          /* From theme's light/background */\n  --theme-font-heading: \"Theme Header Font\", sans-serif;\n  --theme-font-body: \"Theme Body Font\", sans-serif;\n}"
      },
      {
        "title": "Documents / Reports",
        "body": "Cover page: Primary dark background with light text\nSection headers: Accent color with header font\nBody: Body font on light background\nCharts/tables: Use accent and secondary for data series\nCallout boxes: Secondary color as background with primary text"
      },
      {
        "title": "Creating a Custom Theme",
        "body": "When no preset fits, generate a custom theme:\n\nGather input — Ask about the brand, audience, mood, and context\nSelect palette — Choose 4 colors that form a cohesive palette:\n\nOne dark anchor color (backgrounds, text)\nOne primary accent (emphasis, CTAs)\nOne secondary accent (supporting elements)\nOne light/neutral (backgrounds, whitespace)\n\n\nPair fonts — Choose complementary heading and body fonts:\n\nHeading: distinctive, personality-driven\nBody: readable, clean\n\n\nValidate contrast — Ensure WCAG AA compliance for text on backgrounds\nName the theme — Give it an evocative name describing the visual feeling\nDocument — Write a theme file matching the standard format\nReview — Show the theme for approval before applying"
      },
      {
        "title": "Palette Harmony Rules",
        "body": "Complementary: Colors opposite on the wheel (high contrast)\nAnalogous: Colors adjacent on the wheel (harmonious)\nTriadic: Three evenly spaced colors (vibrant but balanced)\nSplit-complementary: Base + two colors adjacent to its complement (versatile)"
      },
      {
        "title": "Contrast Guidelines",
        "body": "Ensure readability when applying any theme:\n\nCombinationMinimum RatioWCAG LevelBody text on background4.5:1AALarge text (18px+) on background3:1AAUI components / borders3:1AAEnhanced readability7:1AAA\n\nTest accent colors against both light and dark backgrounds before finalizing."
      },
      {
        "title": "Available Themes",
        "body": "All theme definitions are in the themes/ directory:\n\nthemes/ocean-depths.md\nthemes/sunset-boulevard.md\nthemes/forest-canopy.md\nthemes/modern-minimalist.md\nthemes/golden-hour.md\nthemes/arctic-frost.md\nthemes/desert-rose.md\nthemes/tech-innovation.md\nthemes/botanical-garden.md\nthemes/midnight-galaxy.md"
      },
      {
        "title": "NEVER Do",
        "body": "Apply a theme without confirmation — always get explicit user selection\nMix colors from different themes — each theme is a cohesive unit\nIgnore contrast ratios — readability trumps aesthetics\nUse accent colors for large text blocks — accents are for emphasis only\nSkip font pairing — headers and body fonts must complement each other\nHardcode theme values — use CSS variables for easy theme switching"
      },
      {
        "title": "Related Skills",
        "body": "design-system-patterns — Token architecture and theming infrastructure\ndistinctive-design-systems — Aesthetic documentation and unique visual identity"
      }
    ],
    "body": "Theme Factory\n\nApply consistent, professional styling to any artifact using curated themes with color palettes and font pairings.\n\nWhen to Use\nStyling slide decks, reports, or documents with a cohesive visual identity\nApplying color palettes and font pairings to HTML pages or landing pages\nChoosing a pre-built theme for quick professional styling\nCreating a custom theme when none of the presets fit\nHow to Use\nStep 1: Present Available Themes\n\nShow the user the 10 available themes with their descriptions:\n\n#\tTheme\tVibe\tBest For\n1\tOcean Depths\tProfessional, calming maritime\tCorporate, financial, consulting\n2\tSunset Boulevard\tWarm, vibrant energy\tCreative pitches, marketing, events\n3\tForest Canopy\tNatural, grounded earth tones\tEnvironmental, sustainability, wellness\n4\tModern Minimalist\tClean, contemporary grayscale\tTech, architecture, design showcases\n5\tGolden Hour\tRich, warm autumnal\tHospitality, lifestyle, artisan brands\n6\tArctic Frost\tCool, crisp precision\tHealthcare, technology, clean tech\n7\tDesert Rose\tSoft, sophisticated dusty tones\tFashion, beauty, interior design\n8\tTech Innovation\tBold, high-contrast modern\tStartups, software launches, AI/ML\n9\tBotanical Garden\tFresh, organic vibrancy\tFood, garden, natural products\n10\tMidnight Galaxy\tDramatic, cosmic depth\tEntertainment, gaming, luxury brands\nStep 2: Get User Selection\n\nAsk which theme to apply. Wait for explicit confirmation before proceeding.\n\nStep 3: Apply the Theme\nRead the selected theme file from themes/ directory\nApply colors and fonts consistently throughout the artifact\nEnsure proper contrast and readability\nMaintain the theme's visual identity across all pages/slides\nTheme File Structure\n\nEach theme in themes/ follows this format:\n\n# Theme Name\n\nDescription of the visual mood and inspiration.\n\n## Color Palette\n- **Primary Dark**: `#hex` — Usage description\n- **Accent**: `#hex` — Usage description\n- **Secondary**: `#hex` — Usage description\n- **Light/Background**: `#hex` — Usage description\n\n## Typography\n- **Headers**: Font family\n- **Body Text**: Font family\n\n## Best Used For\nContext and audience descriptions.\n\nApplying Themes to Different Artifacts\nSlide Decks\nBackground: Use the primary dark color for title slides, light color for content slides\nHeaders: Apply the header font in the accent color\nBody text: Use the body font in the primary dark color on light backgrounds\nAccents: Use accent/secondary colors for charts, highlights, dividers\nHTML / Landing Pages\n:root {\n  --theme-primary: #hex;     /* From theme's primary dark */\n  --theme-accent: #hex;      /* From theme's accent color */\n  --theme-secondary: #hex;   /* From theme's secondary */\n  --theme-bg: #hex;          /* From theme's light/background */\n  --theme-font-heading: \"Theme Header Font\", sans-serif;\n  --theme-font-body: \"Theme Body Font\", sans-serif;\n}\n\nDocuments / Reports\nCover page: Primary dark background with light text\nSection headers: Accent color with header font\nBody: Body font on light background\nCharts/tables: Use accent and secondary for data series\nCallout boxes: Secondary color as background with primary text\nCreating a Custom Theme\n\nWhen no preset fits, generate a custom theme:\n\nGather input — Ask about the brand, audience, mood, and context\nSelect palette — Choose 4 colors that form a cohesive palette:\nOne dark anchor color (backgrounds, text)\nOne primary accent (emphasis, CTAs)\nOne secondary accent (supporting elements)\nOne light/neutral (backgrounds, whitespace)\nPair fonts — Choose complementary heading and body fonts:\nHeading: distinctive, personality-driven\nBody: readable, clean\nValidate contrast — Ensure WCAG AA compliance for text on backgrounds\nName the theme — Give it an evocative name describing the visual feeling\nDocument — Write a theme file matching the standard format\nReview — Show the theme for approval before applying\nPalette Harmony Rules\nComplementary: Colors opposite on the wheel (high contrast)\nAnalogous: Colors adjacent on the wheel (harmonious)\nTriadic: Three evenly spaced colors (vibrant but balanced)\nSplit-complementary: Base + two colors adjacent to its complement (versatile)\nContrast Guidelines\n\nEnsure readability when applying any theme:\n\nCombination\tMinimum Ratio\tWCAG Level\nBody text on background\t4.5:1\tAA\nLarge text (18px+) on background\t3:1\tAA\nUI components / borders\t3:1\tAA\nEnhanced readability\t7:1\tAAA\n\nTest accent colors against both light and dark backgrounds before finalizing.\n\nAvailable Themes\n\nAll theme definitions are in the themes/ directory:\n\nthemes/ocean-depths.md\nthemes/sunset-boulevard.md\nthemes/forest-canopy.md\nthemes/modern-minimalist.md\nthemes/golden-hour.md\nthemes/arctic-frost.md\nthemes/desert-rose.md\nthemes/tech-innovation.md\nthemes/botanical-garden.md\nthemes/midnight-galaxy.md\nNEVER Do\nApply a theme without confirmation — always get explicit user selection\nMix colors from different themes — each theme is a cohesive unit\nIgnore contrast ratios — readability trumps aesthetics\nUse accent colors for large text blocks — accents are for emphasis only\nSkip font pairing — headers and body fonts must complement each other\nHardcode theme values — use CSS variables for easy theme switching\nRelated Skills\ndesign-system-patterns — Token architecture and theming infrastructure\ndistinctive-design-systems — Aesthetic documentation and unique visual identity"
  },
  "trust": {
    "sourceLabel": "tencent",
    "provenanceUrl": "https://clawhub.ai/wpank/theme-factory",
    "publisherUrl": "https://clawhub.ai/wpank/theme-factory",
    "owner": "wpank",
    "version": "1.0.0",
    "license": null,
    "verificationStatus": "Indexed source record"
  },
  "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"
  }
}