metalsmith-website-skills
Build static websites using Metalsmith's component-based architecture. Triggers on phrases like "build me a website", "create a landing page", "help me make a site". Includes JavaScript and CSS development standards.
Best use case
metalsmith-website-skills is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Build static websites using Metalsmith's component-based architecture. Triggers on phrases like "build me a website", "create a landing page", "help me make a site". Includes JavaScript and CSS development standards.
Teams using metalsmith-website-skills should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/metalsmith-website-skills/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How metalsmith-website-skills Compares
| Feature / Agent | metalsmith-website-skills | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Build static websites using Metalsmith's component-based architecture. Triggers on phrases like "build me a website", "create a landing page", "help me make a site". Includes JavaScript and CSS development standards.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# Metalsmith Website Skills This skill bundle enables building professional static websites through conversation. The user describes what they want, Claude handles the implementation. ## Included Skills This bundle contains three complementary skills: 1. **component-builder/** - The main workflow for building Metalsmith websites 2. **javascript-development/** - JavaScript patterns and standards for any custom code 3. **css-layout-development/** - CSS layout patterns using modern intrinsic design ## When to Use Each Skill - **Starting a website**: Read `component-builder/SKILL.md` first - **Writing JavaScript** (browser scripts, custom build code): Consult `javascript-development/SKILL.md` - **Creating CSS layouts** (custom components, style modifications): Consult `css-layout-development/SKILL.md` ## Quick Start Workflow When a user wants to build a website: 1. Read `component-builder/SKILL.md` for the full workflow 2. Follow the 6 phases: Setup → Discovery → Components → Pages → Review → Publish 3. When writing any JavaScript, apply patterns from `javascript-development/SKILL.md` 4. When writing any CSS, apply patterns from `css-layout-development/SKILL.md` ## GitHub Integration This workflow assumes the user will commit their site to GitHub for deployment via Netlify. **For new users without GitHub:** 1. Guide them to create a free account at github.com 2. Help them create a new repository for their website 3. Configure git in their project to point to that repo 4. Handle commits and pushes on their behalf **For returning users:** 1. Clone their existing repository 2. Make the requested changes 3. Commit and push the updates ## Target Audience Users who: - Have the Claude Desktop app installed - Can follow basic instructions - Want a website without learning technical details Users do NOT need to: - Know how to code - Understand Git, Node.js, or build tools - Have any development environment set up Claude handles all technical aspects invisibly.
Related Skills
makepad-skills
Makepad UI development skills for Rust apps: setup, patterns, shaders, packaging, and troubleshooting.
interview-skills
Frameworks for technical interviews and salary negotiation. Use for behavioral interview prep (STAR method), technical interview communication, offer evaluation, and compensation negotiation strategies.
inspecting-skills
Discovers and indexes Python code in skills, enabling cross-skill imports. Use when importing functions from other skills or analyzing skill codebases.
Getting Started with Skills
Skills wiki intro - mandatory workflows, search tool, brainstorming triggers
find-skills
Helps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.
extracting-learned-skills
Extracts reusable skills and decision-making heuristics from debugging sessions. Use after solving tricky bugs, discovering non-obvious workarounds, or finding hidden gotchas specific to a codebase. Triggers include "save this as a skill", "learn from this", or after significant debugging effort.
emrah-skills
Expo React Native mobile app development with expo-iap in-app purchases, AdMob ads, i18n localization, ATT tracking transparency, optional OIDC authentication, onboarding flow, paywall, and NativeTabs navigation
designer-skills
Designer subsystem patterns for LlamaFarm. Covers React 18, TanStack Query, TailwindCSS, and Radix UI.
creating-skills
Use when creating new Claude Code skills or improving existing ones - ensures skills are discoverable, scannable, and effective through proper structure, CSO optimization, and real examples
courier-notification-skills
Use when building notifications across email, SMS, push, in-app, Slack, Teams, or WhatsApp. Covers transactional messages (password reset, OTP, orders, billing), growth notifications (onboarding, engagement, referral), multi-channel routing, compliance (GDPR, TCPA, CAN-SPAM), and reliability patterns.
claude-code-skills
Comprehensive reference for creating Claude Code skills with progressive disclosure, SKILL.md structure, references/ organization, frontmatter specification, and best practices for modular capability development.
backend-skills
Master Node.js, Express, PHP, Laravel, Java, Spring Boot, API design, and database integration. Build scalable APIs and server applications.