# Top 48 Image With Text Sections for Shopify (Updated Oct 2026)

> Compare 48 free image with text sections for Shopify across 15 themes: 47 ship as Liquid, 44 need 0 KB JS. Live demos, agent prompts. Updated Oct 2026.

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

## Items

1. [Claim panel](https://blocko.ai/library/balm/sections/balm-claim-panel/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--balm-claim-panel.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 "Claim panel" (id `balm-claim-panel`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--balm-claim-panel.html; Shopify bundle: sections/balm/balm-claim-panel/ 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. [Feature driver](https://blocko.ai/library/balm/sections/feature-driver/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--feature-driver.html; Shopify bundle: sections/balm/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/balm/sections/ingredients-callout/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/balm/ingredients-callout/ 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. [The Balm story](https://blocko.ai/library/balm/sections/image-with-text-story/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--image-with-text-story.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 "The Balm story" (id `image-with-text-story`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/balm/image-with-text-story/ 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. [Three-step ritual](https://blocko.ai/library/balm/sections/balm-ritual-steps/) (Balm, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--balm-ritual-steps.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 "Three-step ritual" (id `balm-ritual-steps`, theme `balm`; live demo: https://demo.blocko.ai/html/balm/sections/image-with-text--balm-ritual-steps.html; Shopify bundle: sections/balm/balm-ritual-steps/ 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. [Feature driver](https://blocko.ai/library/bare/sections/feature-driver/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/bare/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/image-with-text--feature-driver.html; Shopify bundle: sections/bare/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/bare/sections/ingredients-callout/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/bare/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/bare/ingredients-callout/ 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. [Our story](https://blocko.ai/library/bare/sections/image-with-text-story/) (Bare, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/bare/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `bare`; live demo: https://demo.blocko.ai/html/bare/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/bare/image-with-text-story/ 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. [About us](https://blocko.ai/library/blush/sections/image-with-text-story/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/blush/sections/image-with-text--image-with-text-story.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 "About us" (id `image-with-text-story`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/blush/image-with-text-story/ 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. [Feature driver](https://blocko.ai/library/blush/sections/feature-driver/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/blush/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/image-with-text--feature-driver.html; Shopify bundle: sections/blush/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/blush/sections/ingredients-callout/) (Blush, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/blush/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `blush`; live demo: https://demo.blocko.ai/html/blush/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/blush/ingredients-callout/ 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. [Feature driver](https://blocko.ai/library/clip/sections/feature-driver/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/clip/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/image-with-text--feature-driver.html; Shopify bundle: sections/clip/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/clip/sections/ingredients-callout/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/clip/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/clip/ingredients-callout/ 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. [Our story](https://blocko.ai/library/clip/sections/image-with-text-story/) (Clip, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/clip/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `clip`; live demo: https://demo.blocko.ai/html/clip/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/clip/image-with-text-story/ 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. [About](https://blocko.ai/library/dew/sections/image-with-text-story/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--image-with-text-story.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 "About" (id `image-with-text-story`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/dew/image-with-text-story/ 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. [Feature driver](https://blocko.ai/library/dew/sections/feature-driver/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--feature-driver.html; Shopify bundle: sections/dew/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/dew/sections/ingredients-callout/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/dew/ingredients-callout/ 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. [Actives feature](https://blocko.ai/library/isle/sections/isle-actives/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/isle/sections/image-with-text--isle-actives.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 "Actives feature" (id `isle-actives`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/image-with-text--isle-actives.html; Shopify bundle: sections/isle/isle-actives/ 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. [Ingredient callout](https://blocko.ai/library/isle/sections/ingredients-callout/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/isle/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/isle/ingredients-callout/ 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. [Our story](https://blocko.ai/library/isle/sections/image-with-text-story/) (Isle, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/isle/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `isle`; live demo: https://demo.blocko.ai/html/isle/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/isle/image-with-text-story/ 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. [Feature driver](https://blocko.ai/library/lather/sections/feature-driver/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/lather/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/image-with-text--feature-driver.html; Shopify bundle: sections/lather/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/lather/sections/ingredients-callout/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/lather/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/lather/ingredients-callout/ 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. [Our story](https://blocko.ai/library/lather/sections/image-with-text-story/) (Lather, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/lather/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `lather`; live demo: https://demo.blocko.ai/html/lather/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/lather/image-with-text-story/ 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. [Feature driver](https://blocko.ai/library/prism/sections/feature-driver/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/prism/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/image-with-text--feature-driver.html; Shopify bundle: sections/prism/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/prism/sections/ingredients-callout/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/prism/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/prism/ingredients-callout/ 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. [Our story](https://blocko.ai/library/prism/sections/image-with-text-story/) (Prism, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/prism/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `prism`; live demo: https://demo.blocko.ai/html/prism/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/prism/image-with-text-story/ 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. [Feature driver](https://blocko.ai/library/shelf/sections/feature-driver/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/shelf/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/image-with-text--feature-driver.html; Shopify bundle: sections/shelf/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/shelf/sections/ingredients-callout/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/shelf/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/shelf/ingredients-callout/ 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. [Our standard](https://blocko.ai/library/shelf/sections/image-with-text-story/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/shelf/sections/image-with-text--image-with-text-story.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 "Our standard" (id `image-with-text-story`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/shelf/image-with-text-story/ 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. [Visit and book split](https://blocko.ai/library/shelf/sections/shelf-visit/) (Shelf, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: split
   - Live demo: https://demo.blocko.ai/html/shelf/sections/split--shelf-visit.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 "Visit and book split" (id `shelf-visit`, theme `shelf`; live demo: https://demo.blocko.ai/html/shelf/sections/split--shelf-visit.html; Shopify bundle: sections/shelf/shelf-visit/ 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. [Colour-block story](https://blocko.ai/library/stubble/sections/stubble-color-story/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--stubble-color-story.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 "Colour-block story" (id `stubble-color-story`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--stubble-color-story.html; Shopify bundle: sections/stubble/stubble-color-story/ 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. [Feature driver](https://blocko.ai/library/stubble/sections/feature-driver/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--feature-driver.html; Shopify bundle: sections/stubble/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/stubble/sections/ingredients-callout/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/stubble/ingredients-callout/ 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. [Why Stubble](https://blocko.ai/library/stubble/sections/image-with-text-story/) (Stubble, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--image-with-text-story.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 "Why Stubble" (id `image-with-text-story`, theme `stubble`; live demo: https://demo.blocko.ai/html/stubble/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/stubble/image-with-text-story/ 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. [Feature driver](https://blocko.ai/library/tide/sections/feature-driver/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/tide/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/image-with-text--feature-driver.html; Shopify bundle: sections/tide/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/tide/sections/ingredients-callout/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/tide/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/tide/ingredients-callout/ 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. [Our story](https://blocko.ai/library/tide/sections/image-with-text-story/) (Tide, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/tide/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `tide`; live demo: https://demo.blocko.ai/html/tide/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/tide/image-with-text-story/ 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. [Ingredient callout](https://blocko.ai/library/tint/sections/ingredients-callout/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/tint/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/tint/ingredients-callout/ 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. [Our story](https://blocko.ai/library/tint/sections/image-with-text-story/) (Tint, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/tint/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `tint`; live demo: https://demo.blocko.ai/html/tint/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/tint/image-with-text-story/ 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. [Ingredient callout](https://blocko.ai/library/twist/sections/ingredients-callout/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/twist/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/twist/ingredients-callout/ 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. [our story](https://blocko.ai/library/twist/sections/image-with-text-story/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/twist/sections/image-with-text--image-with-text-story.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 "our story" (id `image-with-text-story`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/twist/image-with-text-story/ 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. [Feature driver](https://blocko.ai/library/veil/sections/feature-driver/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/veil/sections/image-with-text--feature-driver.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 "Feature driver" (id `feature-driver`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/image-with-text--feature-driver.html; Shopify bundle: sections/veil/feature-driver/ 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. [Ingredient callout](https://blocko.ai/library/veil/sections/ingredients-callout/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/veil/sections/image-with-text--ingredients-callout.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 "Ingredient callout" (id `ingredients-callout`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/image-with-text--ingredients-callout.html; Shopify bundle: sections/veil/ingredients-callout/ 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. [Our story](https://blocko.ai/library/veil/sections/image-with-text-story/) (Veil, beauty)
   - Shopify Liquid: ready; JavaScript: 0 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/veil/sections/image-with-text--image-with-text-story.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 "Our story" (id `image-with-text-story`, theme `veil`; live demo: https://demo.blocko.ai/html/veil/sections/image-with-text--image-with-text-story.html; Shopify bundle: sections/veil/image-with-text-story/ 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. [Feels, looks, smells](https://blocko.ai/library/dew/sections/dew-facts/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0.7 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--dew-facts.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 "Feels, looks, smells" (id `dew-facts`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--dew-facts.html; Shopify bundle: sections/dew/dew-facts/ 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. [Philosophy panel](https://blocko.ai/library/dew/sections/dew-philosophy/) (Dew, beauty)
   - Shopify Liquid: ready; JavaScript: 0.7 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--dew-philosophy.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 "Philosophy panel" (id `dew-philosophy`, theme `dew`; live demo: https://demo.blocko.ai/html/dew/sections/image-with-text--dew-philosophy.html; Shopify bundle: sections/dew/dew-philosophy/ 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. [Story split](https://blocko.ai/library/twist/sections/twist-story/) (Twist, beauty)
   - Shopify Liquid: ready; JavaScript: 1.7 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/twist/sections/image-with-text--twist-story.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 "Story split" (id `twist-story`, theme `twist`; live demo: https://demo.blocko.ai/html/twist/sections/image-with-text--twist-story.html; Shopify bundle: sections/twist/twist-story/ 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. [Scent profile story](https://blocko.ai/library/tress/sections/pdp-scent-story/) (Tress, beauty)
   - Shopify Liquid: not yet (not migrated to neutral template); JavaScript: 3.1 KB; category: image-with-text
   - Live demo: https://demo.blocko.ai/html/tress/sections/image-with-text--pdp-scent-story.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 "Scent profile story" (id `pdp-scent-story`, theme `tress`; live demo: https://demo.blocko.ai/html/tress/sections/image-with-text--pdp-scent-story.html; no Shopify bundle yet (not migrated to neutral template) — port it from the HTML demo demo/tress/sections/image-with-text--pdp-scent-story.html into a Liquid section with a {% schema %}, mirroring the structure of an existing bundle in sections/veil/) 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 image with text sections for Shopify?

Blocko lists 48 free, MIT-licensed image with text sections from 15 themes. 47 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 Claim panel from Balm comes first.

### Are these image with text 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 image with text 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 image with text sections cover?

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

### How much JavaScript do these image with text sections ship?

44 of 48 ship 0 KB of JavaScript. The heaviest is Scent profile story in Tress at 3.1 KB, registered as an idempotent Custom Element.

