Theme Shopify Css Guidelines
Helps with CSS, guidelines as part of building frontend UIs and user experiences workflows.
Install on your platform
We auto-selected Claude Code based on this skill’s supported platforms.
Run in terminal (recommended)
claude mcp add theme-shopify-css-guidelines npx -- -y @trustedskills/theme-shopify-css-guidelines
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"theme-shopify-css-guidelines": {
"command": "npx",
"args": [
"-y",
"@trustedskills/theme-shopify-css-guidelines"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
This skill provides guidelines for writing CSS specifically tailored to Shopify themes. It ensures consistency and adherence to best practices within the Shopify ecosystem, covering aspects like naming conventions, file structure, and common styling patterns. The goal is to produce maintainable and performant Shopify theme stylesheets.
When to use it
- You're developing a new Shopify theme from scratch and need guidance on CSS architecture.
- You’re refactoring an existing Shopify theme and want to improve its code quality and consistency.
- A junior developer is working on your Shopify theme, and you need to ensure they follow established styling standards.
- You're troubleshooting a CSS issue in a Shopify theme and suspect it might be due to non-compliant coding practices.
Key capabilities
- Provides guidelines for Shopify CSS naming conventions.
- Offers recommendations for file structure within a Shopify theme’s stylesheet directory.
- Covers common styling patterns used in Shopify themes.
- Promotes maintainable and performant Shopify theme stylesheets.
Example prompts
- "What are the recommended CSS naming conventions for Shopify themes?"
- "How should I structure my CSS files within a Shopify theme?"
- "Give me an example of a common styling pattern used in Shopify themes."
Tips & gotchas
This skill assumes some basic familiarity with CSS and Shopify theme development. The guidelines provided are intended to be followed consistently for optimal results.
Tags
TrustedSkills Verification
Unlike other registries that point to live repositories, TrustedSkills pins every skill to a verified commit hash. This protects you from malicious updates — what you install today is exactly what was reviewed and verified.
Security Audits
| Gen Agent Trust Hub | Pass |
| Socket | Pass |
| Snyk | Pass |
🌐 Community
Passed automated security scans.