Free Framer component
Fold Rows
An accordion for FAQs, services and steps. Rows open smoothly, work with the keyboard and screen readers, and can carry a number, a picture and a link.
Open a row with a click, or with Tab and Enter. ↑ and ↓ move between rows.
Services, with pictures and links
Cards, a chevron and a fill on the open row. Each row can have a picture and a link. The first two links open a question above.
Steps, several open at once
Open: Several. Numbers on, arrow icon, plain lines.
Details
Smooth, no jumps
Rows open to their real height, so long answers and pictures are never cut off.
Keyboard and screen readers
Each title is a button that says if it is open. Enter or Space opens it, ↑ ↓ Home End move between rows.
Open from a link
yoursite.com/faq#shipping opens the row called “Shipping” and scrolls to it.
FAQ data
One switch adds schema.org FAQPage data, so search engines can read your questions and answers.
Your look
Lines or cards, any font and color, plus, chevron, arrow or no icon, numbers on or off.
Reduced motion
Visitors who turn off motion see rows open without animation. On the canvas, you choose which row is open.
Settings
Rows
Title, text, an optional picture, and an optional link with its own text. A blank line in the text starts a new paragraph.
Open / Start open
One row at a time or several. The row that is open when the page loads (0: all closed).
Numbers / Icon
Numbers 01, 02, … before the titles. Plus, chevron, arrow or no icon.
Title tag
H2, H3, H4 or none, so the titles fit your page outline.
Look / Open row
Lines or cards. The open row plain, filled, or Shift: filled with an outline moved down and right.
Fonts / Colors
Title, text and number fonts. Title, text, lines, accent, card and fill colors.
Padding / Gap / Radius / Picture ratio
Space inside rows, between cards, card corners, and picture width ÷ height.
Duration
How long a row takes to open.
Open from link / FAQ data
page#row-title opens that row. FAQPage data for search engines (use it on one FAQ per page).
On canvas
The row shown open on the canvas, to design it.
How to use it
01
Open the component on the Framer Marketplace and copy it.
02
Paste it on any page of your Framer project (⌘V).
03
Change the settings in the right panel. Preview to see it move.
From the same maker
Framer templates by H SHIFT WORKS
CIRCLED
Booking site for portrait and wedding photographers.
View template →
AGENDA
Conference site with schedule, speakers and venue.
View template →
OFFSET
Studio site for an independent digital agency.
View template →
TRUSS
Site for renovation and design-build companies.
View template →
GAZE
Dark, photo-led portfolio for one visual artist.
View template →
© 2026 H SHIFT WORKS. Framer templates, plugins and components.
framer.com/@hshiftworks
X: @hshiftworks