Skip to content
L-203Layout

Project Curve Rail

Pointer/drag-bent project showcase built as a plain, fully editable Etch tree: section > container > header (eyebrow, h2, intro, theme toggle, expand/contract toggle) > a native scroll-snap rail of eight "Curve Card" com…

Get this with ProIncluded in your plan

50 sites for €79 only, Compare all plans

Preview Desktop, 1280px

The system behind it

One pattern, your whole brand.

Project Curve Rail 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
Layout
Category
Sliders and carousels
Responsive
Desktop to phone
Works with
Etch, ACSS, plain CSS

Options 28

Set on the section, in Etch’s attributes panel. No code needed.

data-theme
lightdark

data-bend
subtlemediumbold

curve strength of the rail

data-tilt
truefalse

subtle pointer-parallax micro-tilt added on top of the scroll-driven curve

data-density
compactcomfortableairy

gap between cards

data-radius
nonesmlxl

card corner radius

data-card-style
flatelevatedoutlineglass

card surface treatment

data-panel
truefalse

show the live detail panel under the rail

data-fullscreen-toggle
truefalse

show the expand/contract control

data-drag
truefalse

mouse-drag-to-scroll in addition to touch swipe

data-autoplay
truefalse

data-delay
number

ms

data-speed
number

ms

data-loop
truefalse

data-pause-on-hover
truefalse

data-arrows
truefalse

data-arrows-position
sidesbottom-startbottom-centerbottom-end

data-arrows-style
circlesquarepillminimal

data-arrows-mobile
truefalse

data-pagination
dotsfractionnone

data-pagination-position
bottom-centerbottom-startbottom-endoverlay-bottom

data-controls-layout
splitgrouped

data-scrollbar
truefalse

data-autoplay-button
truefalse

data-anim
faderisescalenone

data-duration
number

ms · data-easing

data-stagger
number

ms

data-once
truefalse

data-reduced
fadenone

for the entrance reveal

Component props 1

Only the repeating unit is a component. Duplicate, reorder or delete it in Layers and edit these props.

Curve Card8 in this pattern · 7 props
PropTypeDefault
image
text

https://images.unsplash.com/photo-1551288049-bebda4e38f71?w=480

imageAlt
text

Orbit Analytics preview

title
text

Orbit Analytics

tag
text

Product design

summary
text

A metrics cockpit for ops teams who live in dashboards all day — rebu…

url
text

#work

ctaLabel
text

View case study

Included in Pro From €39 a year, with all 469 patterns.

Get Pro

More patterns

Keep browsing.

L-000

Quick View

Desktop, 1440px
Pro
demo.etchedy.com

The real preview of this pattern. Every pattern adapts to your ACSS tokens.

Unlock with ProSee plansIncluded in your plan