Compare Features LandingLanding page, 1 page
Flowline SaaS LandingLanding page, 1 page
Prismo Creative AgencyCreative, 1 page
Velour Car DetailingLanding page, 1 pageScatter Pin Gallery
Six "Pin Card" component instances (photo, photoAlt, label, tone, showLabel, href/showLink) loosely scattered and rotated across a table-top cluster, built as a plain, fully editable Etch tree: section > container > head…
50 sites for €79 only, Compare all plans
All photos and visual assets used in this preview are sourced from Unsplash.
The system behind it
One pattern, your whole brand.
Scatter Pin Gallery reads your ACSS tokens, so changing a color, a font or a spacing value once restyles it everywhere. No hard-coded values, nothing to override.
- Type
- Component
- Category
- Galleries
- Responsive
- Desktop to phone
- Works with
- Etch, ACSS, plain CSS
Options 16
Set on the section, in Etch’s attributes panel. No code needed.
data-themere-themes the whole section
data-tilthow far cards scatter and rotate off the baseline
data-hoverhover/focus effect on a card
data-selectclicking/Enter on a card pins it to the front and centre (Esc or clicking it again un-pins)
data-radiuscard corner radius
data-shadowcard shadow depth
data-animentrance animation preset for the whole cluster
data-durationms
data-easingor a cubic-bezier
data-delayms base
data-staggerms per card
data-distancepx
data-directiondata-triggerdata-oncedata-reducedComponent props 1
Only the repeating unit is a component. Duplicate, reorder or delete it in Layers and edit these props.
photohttps://images.unsplash.com/photo-1544005313-94ddf0286df2?w=480
photoAltempty
labelField Notes
tonerose
showLabelTrue
showLinkFalse
hrefempty
Included in Pro From €39 a year, with all 753 patterns.
Get Pro
