Views Style Pack

Views Style Pack adds a Style Pack format to Views with 20 ready-made designs. Pick a design, map your fields to its parts and get a polished listing without writing templates or CSS.

Designs

• Grids: Cards, Horizontal cards, Image overlay cards, Masonry, Gallery, Bento grid, Featured first item, Scrolling carousel
• Lists: Compact list, Ranked list, Magazine, Accordion
• Sequences: Timeline, Alternating timeline, Numbered steps
• Marketing: Pricing table, Testimonials, Team members, Statistics, Feature list

Features

• No CSS framework, no JavaScript, no extra dependencies.
• Works with any theme, in light and dark color schemes.
• Responsive layouts based on container queries.
• Each design loads only its own small stylesheet.
• Per-view column count, spacing and accent color.
• Field slots: media, eyebrow, title, value, body, meta and action.
• Override any design with a views-style-pack--DESIGN.html.twig template.

Getting started

1. Install with composer require drupal/views_style_pack and enable the module.
2. Edit a view and set Format to Style Pack.
3. Choose a design and map your fields in Field slots.

Requirements

Drupal 11.2 or later. Views (core).

Similar projects

Views Bootstrap provides similar layouts but requires a Bootstrap theme. Views Style Pack is framework-free and works with any theme.