3D Rolodex Carousel

Introducing 3D Roledex Carousel

Most CMS lists end up as a grid. 3D Rolodex Carousel puts yours on a desk card file instead: a polished steel housing, notched paper cards and A–Z index tabs. The cards ride a real spindle and tick into place one at a time.

How it works

Drop in a Collection List and you're done. The Rolodex reads every item as a card and builds index tabs from the first letter of each title, or from any CMS field you choose. Add a layer named "Back" to your card and visitors can turn each card over to see more. If there's no Back layer, a back is built from the card's own text.

Your Collection List sits next to the page and connects to the Rolodex's Cards slot. You design the card visually in Framer. Filters, sorting and links to CMS pages keep working, and new CMS items appear in the Rolodex automatically.

Features

- Works with your CMS. Connect one Collection List, or add cards one by one.

- Index tabs. Use first letters, a CMS field such as Category, numbers, or no tabs. Clicking a tab jumps straight to that group.

- Flip to reverse. Click the front card or press Enter to turn it over. Links on the back keep working.

- Four ways to browse. Drag, mouse wheel, page scroll for pinned scroll sections, and the keyboard.

- Fully styleable. Set paper, ink and edge colors, card corners and notches, and paper grain. The housing can be polished or painted steel, a bare rod, or nothing.

- Camera control. Tilt, turn, perspective, fan angle and card spacing. You can stage it as a hero or keep it quiet.

- Responsive. It scales to fit its frame and switches to a compact front-on view on phones.

- Loads fast. Each Rolodex only builds when it's about to scroll into view, and it fades in cleanly with no layout jump.

- Accessible. Keyboard focus, screen-reader announcements, and support for reduced-motion settings.

- Events. On Change and On Flip let you drive the rest of your page from the Rolodex.