---
title: "CMS Tag Grid — Framer component · Best of Framer"
description: "$14.00 · Framer component · by ulz song · Forms. CMS Tag Grid lays a collection into an even grid of fixed-ratio cards and narrows it with tag chips: a chip press swaps a class and CSS…"
canonical: "https://framer.elliotli.dev/component/cms-tag-grid"
---

[Home](/)/[Components](/components)/[Forms](/components/category/forms)/CMS Tag Grid

# CMS Tag Grid

Square gallery filtered by chips

[View on Framer](https://framer.com/marketplace/components/cms-tag-grid/?via=elliot-li)

![CMS Tag Grid preview image 1](https://framer.elliotli.dev/og/component/cms-tag-grid/fe16c0b5099bf535/1600x1200.jpg)

## Summary

CMS Tag Grid lays a collection into an even grid of fixed-ratio cards and narrows it with tag chips: a chip press swaps a class and CSS does the rest, nothing measured and no…

## Description

CMS Tag Grid lays a collection into an even grid of fixed-ratio cards and narrows it with tag chips: a chip press swaps a class and CSS does the rest, nothing measured and no observer.

Pick several tags at once and choose whether a card carries any of them or every one; each chip shows the count behind it and a polite line reads out the total on screen.

Bind a CMS collection through the card slots, or use the built-in card face at 1:1, 4:5 or 16:9; columns follow the frame, and the Framer canvas shows the finished grid on its first frame.

\- \*\*One even grid.\*\* Every card face shares a ratio, so rows line up.

\- \*\*Three ratios.\*\* Square, 4:5 or 16:9, set once.

\- \*\*Chips that stack.\*\* Several tags stay on at once, matching any tag or every tag.

\- \*\*One class swap.\*\* A chip press swaps classes; the rest is CSS.

\- \*\*Counts on the chips.\*\* Each chip carries its count; a polite line reads the total.

\- \*\*CMS slots.\*\* One component slot per card binds a collection straight into the grid.

\- \*\*Columns that follow the frame.\*\* Auto, or two to four across; a phone holds two.

\- \*\*Styled by you.\*\* Gap, radius, five colours, text size, alignment, max width and every label.

What you control

• Items as an array: title, caption, tags as a comma list, image with alt text, link and a tint for the empty face

• Card slots for the CMS path, paired one to one with the items

• Card ratio, column count, gap, radius, match mode, initial tags, the All chip and its label, and alignment

• Five colours, text size, max width, the count wording, the placeholder lines and the accessibility labels

Limits: one grid per section, one ratio for every card face (a slotted card keeps its own height), images from your project or CMS, up to about eighty cards.

## Rank history [How rankings work →](/terms#rankings)

-   All · #5108

## Details

- **Author**: ulz song
- **Price**: $14.00
- **Published**: 2026-09-07
- **Updated**: 2026-09-08
- **Added**: 2026-09-07
- **Categories**: Forms

## More across types

-   [Wallble: Guest Book & Wall of Love](/plugin/wallble-guest-book-wall-of-love) — Wallble · Free — Guest book & Wall of Love

## More like this

-   [Stay Booking Pro](/component/stay-booking-pro) — Design Foundry · $10 — Stay Planner with Dynamic Pricing
-   [Postcode Checker](/component/postcode-checker) — Sean Weekes · $15 — Do we cover your area? (UK
-   [Property Calculators](/component/property-calculators) — Sean Weekes · $12 — UK Stamp Duty, mortgage and yield
-   [UTM Lead Capture](/component/utm-lead-capture) — Sean Weekes · $9 — See where every lead came from
