# Top 105 Brand Guidelines Sections for Shopify (Updated Oct 2026)

> Compare 105 free brand guidelines sections for Shopify across 15 themes: 105 ship as Liquid, 105 need 0 KB JS. Live demos, agent prompts. Updated Oct 2026.

Page: https://blocko.ai/section/brand-guidelines/
MCP: https://blocko.ai/mcp
License: MIT. Not affiliated with Shopify.

## Items

1. [Brand archetype](https://blocko.ai/library/balm/sections/brand-archetype/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/balm/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
2. [Brand guideline hero](https://blocko.ai/library/balm/sections/brand-hero/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/balm/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
3. [Brand imagery](https://blocko.ai/library/balm/sections/brand-imagery/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/balm/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
4. [Brand logo usage](https://blocko.ai/library/balm/sections/brand-logo-usage/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/balm/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
5. [Brand palette](https://blocko.ai/library/balm/sections/brand-palette/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/balm/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
6. [Brand typography](https://blocko.ai/library/balm/sections/brand-typography/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/balm/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
7. [Brand voice](https://blocko.ai/library/balm/sections/brand-voice/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/balm/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
8. [Brand archetype](https://blocko.ai/library/bare/sections/brand-archetype/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/bare/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
9. [Brand guideline hero](https://blocko.ai/library/bare/sections/brand-hero/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/bare/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
10. [Brand imagery](https://blocko.ai/library/bare/sections/brand-imagery/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/bare/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
11. [Brand logo usage](https://blocko.ai/library/bare/sections/brand-logo-usage/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/bare/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
12. [Brand palette](https://blocko.ai/library/bare/sections/brand-palette/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/bare/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
13. [Brand typography](https://blocko.ai/library/bare/sections/brand-typography/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/bare/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
14. [Brand voice](https://blocko.ai/library/bare/sections/brand-voice/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/bare/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
15. [Brand archetype](https://blocko.ai/library/blush/sections/brand-archetype/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/blush/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
16. [Brand guideline hero](https://blocko.ai/library/blush/sections/brand-hero/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/blush/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
17. [Brand imagery](https://blocko.ai/library/blush/sections/brand-imagery/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/blush/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
18. [Brand logo usage](https://blocko.ai/library/blush/sections/brand-logo-usage/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/blush/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
19. [Brand palette](https://blocko.ai/library/blush/sections/brand-palette/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/blush/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
20. [Brand typography](https://blocko.ai/library/blush/sections/brand-typography/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/blush/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
21. [Brand voice](https://blocko.ai/library/blush/sections/brand-voice/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/blush/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
22. [Brand archetype](https://blocko.ai/library/clip/sections/brand-archetype/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/clip/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
23. [Brand guideline hero](https://blocko.ai/library/clip/sections/brand-hero/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/clip/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
24. [Brand imagery](https://blocko.ai/library/clip/sections/brand-imagery/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/clip/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
25. [Brand logo usage](https://blocko.ai/library/clip/sections/brand-logo-usage/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/clip/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
26. [Brand palette](https://blocko.ai/library/clip/sections/brand-palette/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/clip/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
27. [Brand typography](https://blocko.ai/library/clip/sections/brand-typography/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/clip/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
28. [Brand voice](https://blocko.ai/library/clip/sections/brand-voice/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/clip/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
29. [Brand archetype](https://blocko.ai/library/dew/sections/brand-archetype/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/dew/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
30. [Brand guideline hero](https://blocko.ai/library/dew/sections/brand-hero/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/dew/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
31. [Brand imagery](https://blocko.ai/library/dew/sections/brand-imagery/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/dew/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
32. [Brand logo usage](https://blocko.ai/library/dew/sections/brand-logo-usage/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/dew/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
33. [Brand palette](https://blocko.ai/library/dew/sections/brand-palette/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/dew/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
34. [Brand typography](https://blocko.ai/library/dew/sections/brand-typography/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/dew/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
35. [Brand voice](https://blocko.ai/library/dew/sections/brand-voice/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/dew/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
36. [Brand archetype](https://blocko.ai/library/isle/sections/brand-archetype/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/isle/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
37. [Brand guideline hero](https://blocko.ai/library/isle/sections/brand-hero/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/isle/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
38. [Brand imagery](https://blocko.ai/library/isle/sections/brand-imagery/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/isle/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
39. [Brand logo usage](https://blocko.ai/library/isle/sections/brand-logo-usage/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/isle/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
40. [Brand palette](https://blocko.ai/library/isle/sections/brand-palette/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/isle/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
41. [Brand typography](https://blocko.ai/library/isle/sections/brand-typography/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/isle/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
42. [Brand voice](https://blocko.ai/library/isle/sections/brand-voice/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/isle/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
43. [Brand archetype](https://blocko.ai/library/lather/sections/brand-archetype/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/lather/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
44. [Brand guideline hero](https://blocko.ai/library/lather/sections/brand-hero/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/lather/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
45. [Brand imagery](https://blocko.ai/library/lather/sections/brand-imagery/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/lather/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
46. [Brand logo usage](https://blocko.ai/library/lather/sections/brand-logo-usage/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/lather/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
47. [Brand palette](https://blocko.ai/library/lather/sections/brand-palette/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/lather/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
48. [Brand typography](https://blocko.ai/library/lather/sections/brand-typography/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/lather/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
49. [Brand voice](https://blocko.ai/library/lather/sections/brand-voice/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/lather/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
50. [Brand archetype](https://blocko.ai/library/prism/sections/brand-archetype/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/prism/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
51. [Brand guideline hero](https://blocko.ai/library/prism/sections/brand-hero/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/prism/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
52. [Brand imagery](https://blocko.ai/library/prism/sections/brand-imagery/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/prism/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
53. [Brand logo usage](https://blocko.ai/library/prism/sections/brand-logo-usage/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/prism/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
54. [Brand palette](https://blocko.ai/library/prism/sections/brand-palette/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/prism/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
55. [Brand typography](https://blocko.ai/library/prism/sections/brand-typography/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/prism/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
56. [Brand voice](https://blocko.ai/library/prism/sections/brand-voice/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/prism/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
57. [Brand archetype](https://blocko.ai/library/shelf/sections/brand-archetype/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/shelf/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
58. [Brand guideline hero](https://blocko.ai/library/shelf/sections/brand-hero/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/shelf/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
59. [Brand imagery](https://blocko.ai/library/shelf/sections/brand-imagery/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/shelf/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
60. [Brand logo usage](https://blocko.ai/library/shelf/sections/brand-logo-usage/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/shelf/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
61. [Brand palette](https://blocko.ai/library/shelf/sections/brand-palette/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/shelf/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
62. [Brand typography](https://blocko.ai/library/shelf/sections/brand-typography/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/shelf/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
63. [Brand voice](https://blocko.ai/library/shelf/sections/brand-voice/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/shelf/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
64. [Brand archetype](https://blocko.ai/library/stubble/sections/brand-archetype/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/stubble/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
65. [Brand guideline hero](https://blocko.ai/library/stubble/sections/brand-hero/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/stubble/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
66. [Brand imagery](https://blocko.ai/library/stubble/sections/brand-imagery/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/stubble/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
67. [Brand logo usage](https://blocko.ai/library/stubble/sections/brand-logo-usage/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/stubble/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
68. [Brand palette](https://blocko.ai/library/stubble/sections/brand-palette/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/stubble/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
69. [Brand typography](https://blocko.ai/library/stubble/sections/brand-typography/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/stubble/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
70. [Brand voice](https://blocko.ai/library/stubble/sections/brand-voice/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/stubble/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
71. [Brand archetype](https://blocko.ai/library/tide/sections/brand-archetype/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/tide/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
72. [Brand guideline hero](https://blocko.ai/library/tide/sections/brand-hero/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/tide/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
73. [Brand imagery](https://blocko.ai/library/tide/sections/brand-imagery/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/tide/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
74. [Brand logo usage](https://blocko.ai/library/tide/sections/brand-logo-usage/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/tide/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
75. [Brand palette](https://blocko.ai/library/tide/sections/brand-palette/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/tide/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
76. [Brand typography](https://blocko.ai/library/tide/sections/brand-typography/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/tide/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
77. [Brand voice](https://blocko.ai/library/tide/sections/brand-voice/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/tide/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
78. [Brand archetype](https://blocko.ai/library/tint/sections/brand-archetype/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/tint/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
79. [Brand guideline hero](https://blocko.ai/library/tint/sections/brand-hero/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/tint/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
80. [Brand imagery](https://blocko.ai/library/tint/sections/brand-imagery/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/tint/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
81. [Brand logo usage](https://blocko.ai/library/tint/sections/brand-logo-usage/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/tint/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
82. [Brand palette](https://blocko.ai/library/tint/sections/brand-palette/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/tint/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
83. [Brand typography](https://blocko.ai/library/tint/sections/brand-typography/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/tint/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
84. [Brand voice](https://blocko.ai/library/tint/sections/brand-voice/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/tint/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
85. [Brand archetype](https://blocko.ai/library/tress/sections/brand-archetype/) (Tress, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/tress/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
86. [Brand guideline hero](https://blocko.ai/library/tress/sections/brand-hero/) (Tress, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/tress/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
87. [Brand imagery](https://blocko.ai/library/tress/sections/brand-imagery/) (Tress, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/tress/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
88. [Brand logo usage](https://blocko.ai/library/tress/sections/brand-logo-usage/) (Tress, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/tress/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
89. [Brand palette](https://blocko.ai/library/tress/sections/brand-palette/) (Tress, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/tress/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
90. [Brand typography](https://blocko.ai/library/tress/sections/brand-typography/) (Tress, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/tress/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
91. [Brand voice](https://blocko.ai/library/tress/sections/brand-voice/) (Tress, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/tress/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
92. [Brand archetype](https://blocko.ai/library/twist/sections/brand-archetype/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/twist/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
93. [Brand guideline hero](https://blocko.ai/library/twist/sections/brand-hero/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/twist/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
94. [Brand imagery](https://blocko.ai/library/twist/sections/brand-imagery/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/twist/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
95. [Brand logo usage](https://blocko.ai/library/twist/sections/brand-logo-usage/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/twist/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
96. [Brand palette](https://blocko.ai/library/twist/sections/brand-palette/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/twist/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
97. [Brand typography](https://blocko.ai/library/twist/sections/brand-typography/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/twist/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
98. [Brand voice](https://blocko.ai/library/twist/sections/brand-voice/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/twist/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
99. [Brand archetype](https://blocko.ai/library/veil/sections/brand-archetype/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-archetype.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand archetype" (id `brand-archetype`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-archetype.html; Shopify bundle: sections/veil/brand-archetype/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
100. [Brand guideline hero](https://blocko.ai/library/veil/sections/brand-hero/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-hero.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand guideline hero" (id `brand-hero`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-hero.html; Shopify bundle: sections/veil/brand-hero/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
101. [Brand imagery](https://blocko.ai/library/veil/sections/brand-imagery/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-imagery.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand imagery" (id `brand-imagery`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-imagery.html; Shopify bundle: sections/veil/brand-imagery/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
102. [Brand logo usage](https://blocko.ai/library/veil/sections/brand-logo-usage/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-logo-usage.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand logo usage" (id `brand-logo-usage`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-logo-usage.html; Shopify bundle: sections/veil/brand-logo-usage/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
103. [Brand palette](https://blocko.ai/library/veil/sections/brand-palette/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-palette.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand palette" (id `brand-palette`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-palette.html; Shopify bundle: sections/veil/brand-palette/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
104. [Brand typography](https://blocko.ai/library/veil/sections/brand-typography/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-typography.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand typography" (id `brand-typography`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-typography.html; Shopify bundle: sections/veil/brand-typography/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).
105. [Brand voice](https://blocko.ai/library/veil/sections/brand-voice/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: brand-guidelines
   - Live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-voice.html
   - Prompt: Use the Blocko library (https://github.com/blockoai/blocko, or the Claude Code plugin: claude plugin marketplace add blockoai/blocko && claude plugin install blocko-sections@blocko) to implement the section "Brand voice" (id `brand-voice`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/brand-guidelines--brand-voice.html; Shopify bundle: sections/veil/brand-voice/ in the repo) into my project. Before changing any code, ask me where it should go — which project/theme, which page or template, and the position (e.g. after the hero) — and whether the target is a Shopify theme or a plain HTML site, unless I already said; restate the plan and wait for my OK. Then follow the repo's AGENTS.md: keep the blko- class prefix and CSS tokens (with fallbacks), keep custom elements idempotent, don't touch unrelated code, run `shopify theme check` for Shopify targets, and finish by telling me how to add/arrange it (Theme Editor steps for Shopify).

## FAQ

### What are the best brand guidelines sections for Shopify?

Blocko lists 105 free, MIT-licensed brand guidelines sections from 15 themes. 105 of them ship as Shopify Liquid today and the rest are complete HTML demos. The list is ranked with Liquid-ready items first, then by the least JavaScript, so Brand archetype from Balm comes first.

### Are these brand guidelines sections free to use?

Yes. Every item is MIT licensed, free to copy and edit, and needs no app or subscription. Blocko is not affiliated with Shopify.

### How do I add one of these brand guidelines sections to my Shopify store?

Open an item, copy its one-line prompt into your coding agent, or connect the Blocko MCP server at https://blocko.ai/mcp. The agent asks where the section should go before it changes any code.

### Which industries do these brand guidelines sections cover?

Beauty. Every industry with at least three matching items has its own list.

### How much JavaScript do these brand guidelines sections ship?

105 of 105 ship 0 KB of JavaScript. None of them need JavaScript.