Style items collection CMS Webflow

Tutorial
March 20, 2023
3 min
Webflow tutorial and yellow power icon digidop
Key points

Did you know that you can modify the style of the first item, the last item, or the even and odd items in a Webflow collection? This feature is now available in the Webflow Designer, and we will show you how to use it!

Step 1: Add a Collection to One of Your Pages

You can skip this step if you have already inserted a CMS Collection into one of your pages. If not, log into your Webflow account, go to your project Designer, and then insert the "Collection List" element into one of the sections on your page.

Adding collection list element in webflow

Step 2: Select the Collection Item Element

When you add a collection element in the Designer, the hierarchical order includes the Collection List Wrapper, the Collection List, and then the Collection Item which is inserted into your project. To utilize the style modification feature for specific items, you need to select the Collection Item in the navigator. At the same time, you can assign a class to it!

selecting collection item cms webflow

Step 3: Choose a Structure Type in the Selector

Next to your class in the Style Manager's selector, there's a small downward-pointing arrow. This arrow is typically used to modify the style of an element when it has a special status (On Hover, Pressed, Focused, etc.). When you select the "Collection Item" element, new fields that correspond to the statuses will appear; these are structure fields. In these new fields, we have First Item, Last Item, Odd Item, and Even Item.

Depending on your project and website layout, choose one of the structures!

selecting collection item state cms webflow

Step 4: Modify the Style of the Custom Structure

Once you have chosen a structure (first, last, even, or odd), you can apply and create the desired style (a custom style) and design your personalized collection!

4.1 Style the First Item in a Webflow Collection

style first item collection list cms webflow

4.2 Style the Last Item in a Webflow Collection

style last item collection list cms webflow

4.3 Style the Even Items in a Webflow Collection

style even items collection list cms webflow

4.4 Style the Odd Items in a Webflow Collection

style odd items collection list cms webflow

Now you know how to modify the style of specific items in your collection using the various states of the Webflow selector. This feature can be particularly useful when creating e-commerce sites or blogs (learn how to create an SEO-friendly blog in Webflow).

To learn more about elements in Webflow, feel free to read our article on the subject! You can also subscribe to our newsletter to stay updated with our latest articles and contact our agency for your online visibility needs!

Thibaut Legrand
Thibaut Legrand
Technical Solutions Architect & Webflow Expert

Suggested articles

A woman speaks on stage at a conference, wearing a headset microphone. Behind her, a large black screen displays the question “What then?” in bold white text.
Events
Webflow

Digidop attends FLOWconf 2025, the biggest Webflow & marketing event in Europe.

Digidop attends FLOWconf 2025, the biggest Webflow & marketing event in Europe.
Visual overview of several modern web typefaces in 2025, each displayed on a vibrant background: Editorial New, DM Serif Display, Aeonik, SF Pro Rounded, Rader, Champ, Monument, Canicule, Clash Display, Supply, Agrandir, and more — a graphic composition highlighting typographic diversity.
Documentation
Design

The 20 Best Fonts for a Modern and Impactful Website in 2025

The 20 Best Fonts for a Modern and Impactful Website in 2025
Mosaic of homepage designs from several Webflow agencies (Digidop, N4, Refokus, Flow Ninja, Tonik, Finsweet, Edgar Allan), showcasing diverse creative approaches and visual identities centered around the Webflow logo.
Storytelling
Webflow

My Top 7 Webflow Agencies in 2025 (From a Founder’s Perspective)

My Top 7 Webflow Agencies in 2025 (From a Founder’s Perspective)

Want to turn your website into your most valuable asset?

Contact us today