Organic Hero

What this section does

Organic hero with blob-clipped imagery, wave dividers and soft hand-drawn curves — ideal for coffee, bakery, cosmetics and organic-food stores.

Where it goes

• Can be used at most 1 time(s) on one page.
• This section is in every plan — no extra plugin needed.

Styles

Different looks for the same section. You can change the style later; your content stays as it is.

The first 2 styles of every section are open on every store. The rest unlock with the Page Editor plugin — all at once, not style by style.

• Organic Frame

  Freeblob-frame

  Copy with a pill CTA and circular feature badges on the left; an organic blob-clipped image with a floating chip overlapping it on the right

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobStyle, blobTint, showFeatures, features, featureIconColor, floatingChipText, floatingChipBg, headingColor, textColor, accentColor, badgeBg, badgeColor

• Wave Crest

  Freewave-crest

  Centered copy above a full-width media band whose top edge is cut by a sweeping organic wave

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, showWaveDivider, waveColor, waveHeight, headingColor, textColor, accentColor, badgeBg, badgeColor

• Layered Blobs

  Page Editorlayered-blobs

  Centered copy floating over two translucent token-tinted organic blobs; the image sits inside an asymmetric-radius blob

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobTint, blobTint2, showDecor, decorColor, headingColor, textColor, accentColor, badgeBg, badgeColor

• Organic Panel

  Page Editororganic-panel

  A giant-radius colored panel: copy, CTA and a feature-badge row on one side, an organic-cut image on the other

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, panelColor, imageSide, showFeatures, features, featureIconColor, headingColor, textColor, accentColor, badgeBg, badgeColor

• Leaf Split

  Page Editorleaf-split

  Split hero with the image clipped into a leaf shape (two opposite sharp corners), an image-side control and organic dotted decor

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, imageSide, showDecor, decorColor, headingColor, textColor, accentColor, badgeBg, badgeColor

• Arch Portal

  Page Editororganic-arch

  A tall arch-shaped image portal off to one side with a tinted arch echo behind it and doodle accents; copy and dual CTAs on the other

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobTint, showDecor, decorColor, imageSide, headingColor, textColor, accentColor, badgeBg, badgeColor

• Organic Overlay

  Page Editoroverlay-card

  A full-bleed hero image with a giant-radius organic card floating over it carrying the copy and CTA, plus an optional wave divider at the base

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, panelColor, imageSide, showWaveDivider, waveColor, waveHeight, headingColor, textColor, accentColor, badgeBg, badgeColor

• Blob Duo

  Page Editorblob-duo

  A two-image organic collage — a large blob-clipped photo with a smaller pebble-clipped photo overlapping its corner and a floating chip; copy opposite

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, image2, image2Alt, blobStyle, blobTint, floatingChipText, floatingChipBg, imageSide, headingColor, textColor, accentColor, badgeBg, badgeColor

• Curve Split

  Page Editorcurve-split

  An edge-to-edge two-tone split — a solid color half with copy and CTAs whose inner edge is a sweeping organic S-curve over a full-bleed photo half

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, panelColor, imageSide, showDecor, decorColor, headingColor, textColor, accentColor, badgeBg, badgeColor

• Torn Paper

  Page Editortorn-band

  A full-width media band whose top and bottom edges are torn-paper organic jags, with copy and feature badges centered inside over a tint scrim

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, scrimColor, showFeatures, features, featureIconColor, headingColor, textColor, accentColor, badgeBg, badgeColor

• Orbit Bubbles

  Page Editororbit-bubbles

  Centered copy and CTA ringed by a dashed orbit with small circular photo bubbles set on it and a tinted chip bubble, plus doodle decor

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, image2, image2Alt, blobTint, showDecor, decorColor, floatingChipText, floatingChipBg, headingColor, textColor, accentColor, badgeBg, badgeColor

• Arch Trio

  Page Editorarch-trio

  Centered copy above a rhythm of three arches — two photo arches and a tinted arch holding a chip label — with dual CTAs beneath

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, image2, image2Alt, blobTint, floatingChipText, floatingChipBg, headingColor, textColor, accentColor, badgeBg, badgeColor

• Ribbon Sash

  Page Editorribbon-sash

  A diagonal organic ribbon sweeps across the lower hero behind a blob-clipped image; copy and dual CTAs sit on the opposite side

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobStyle, ribbonColor, imageSide, headingColor, textColor, accentColor, badgeBg, badgeColor

• Peek Portal

  Page Editorportal-window

  A full-bleed photo behind a solid color field with an organic blob-shaped hole punched through it, so the product peeks through; copy on the field

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, panelColor, imageSide, showDecor, decorColor, headingColor, textColor, accentColor, badgeBg, badgeColor

• Organic Ticket

  Page Editorstamp-ticket

  A vertical postage-stamp ticket panel with scalloped perforated edges — image band, a dashed perforation divider, then copy and a feature-badge row

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, panelColor, showFeatures, features, featureIconColor, headingColor, textColor, accentColor, badgeBg, badgeColor

• Crossed Ribbons

  Page Editorribbon-cross

  Two organic ribbons sweep in opposite diagonals forming a soft X behind a centered blob-clipped image; copy and dual CTAs above

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobStyle, ribbonColor, ribbonColor2, headingColor, textColor, accentColor, badgeBg, badgeColor

• Ribbon Wrap

  Page Editorribbon-wrap

  A ribbon wraps the image — passing behind it across the hero and re-emerging in front of its lower third like a tied sash; copy opposite

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobStyle, ribbonColor, imageSide, headingColor, textColor, accentColor, badgeBg, badgeColor

• Headline Sash

  Page Editorribbon-banner

  The headline rides a bold tilted wavy-edged ribbon; badge above, subtitle and CTA below, with a blob-clipped image beside it

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobStyle, ribbonColor, imageSide, headingColor, textColor, accentColor, badgeBg, badgeColor

• Ribbon Waves

  Page Editorribbon-stack

  Stacked, phase-shifted undulating ribbon bands fill the lower hero behind centered copy and a wide blob-clipped image

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, blobStyle, ribbonColor, ribbonColor2, headingColor, textColor, accentColor, badgeBg, badgeColor

• Ribbon Strip

  Page Editorribbon-strip

  A full-bleed photo crossed by one thick diagonal ribbon that carries the badge, headline and CTA over a tint scrim

  Specific to this style: badge, title, subtitle, buttons, image, imageAlt, scrimColor, ribbonColor, headingColor, textColor, accentColor, badgeBg, badgeColor

Settings

The fields you see in the Section Settings panel on the right when this section is selected.

Shared by every style

• bg
• contentMaxWidth
• sectionMaxWidth
• horizontalPadding
• verticalPadding
• verticalAlignment
• horizontalAlignment
• horizontalMargin
• verticalMargin
• spacingOverrides
• animationType
• animationDuration
• animationDelay
• animationEasing
• animationStagger
• animationRepeat
• animationParallax
• imageParallax
• animationScrollEffect
• height