# liquid-skills

This plugin teaches Claude Code Shopify Liquid, frontend conventions, and accessibility patterns. Use it when building Shopify themes.

- plugin · `type=plugin` · Claude Code · ★ 35
- Author: Shopify
- License: not stated · policy=link-only · description only; the file stays with the author
- Source: https://github.com/Shopify/liquid-skills/tree/HEAD/plugins/liquid-skills
- Updated: 2026-03-18
- HTML: https://affpapa.org/en/nevibecode/plugins/liquid-skills

## What it does

liquid-skills adds three skills for Shopify theme work in Claude Code. `shopify-liquid-themes` covers JSON schema, LiquidDoc, filters, tags, objects, and translations. `liquid-theme-standards` guides CSS, JavaScript, and HTML work with BEM, design tokens, Web Components, and defensive CSS techniques.

\`liquid-theme-a11y` focuses on WCAG patterns for ecommerce components. The plugin is tied to Shopify theme development, so its guidance is centered on Liquid and the structure of Shopify themes.

## Install

### Claude Code (native platform)

**Plugin marketplace**
In the agent chat (not a shell):
```text
/plugin install liquid-skills@claude-plugins-official
```
In the agent chat (not a shell):
```text
/plugin marketplace add anthropics/claude-plugins-official
```

## When to use it
- understand Shopify JSON schema and LiquidDoc
- write Liquid templates with the right filters and tags
- structure theme CSS with BEM inside `{% stylesheet %}`
- apply WCAG patterns to a store component

## Example prompts
- Create a Shopify theme section and review its Liquid, JSON schema, and LiquidDoc.
- Rewrite this component’s styles using BEM, design tokens, and Web Components.
- Check this store component against relevant WCAG patterns.

## Similar
- [liquid-theme-a11y](https://affpapa.org/en/nevibecode/skills/liquid-theme-a11y.md) — skill · 2800 installs
- [shopify-theme-dev-liquid](https://affpapa.org/en/nevibecode/rules/shopify-theme-dev-liquid.md) — rule · ★ 41024
- [liquid-theme-standards](https://affpapa.org/en/nevibecode/skills/liquid-theme-standards.md) — skill · 2900 installs
- [shopify-theme-development-guidelines](https://affpapa.org/en/nevibecode/skills/shopify-theme-development-guidelines.md) — skill · 898 installs
- [editorial](https://affpapa.org/en/nevibecode/skills/editorial.md) — skill · 2700 installs
- [accessible-animation](https://affpapa.org/en/nevibecode/skills/accessible-animation.md) — skill · 2600 installs

From the same set: [shopify/liquid-skills](https://affpapa.org/en/nevibecode/by/shopify/liquid-skills.md) — 2 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md