# 🧠 CSS Hack: Dynamic CSS in Glide

**URL:** <https://community.glideapps.com/t/css-hack-dynamic-css-in-glide/85080>\
**Category:** Community Resources\
**Tags:** custom-css, tutorial, custom-code\
**Created:** [October 25, 2025, 2:13am UTC](https://community.glideapps.com/t/css-hack-dynamic-css-in-glide/85080 "2025-10-25T02:13:44Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [October 27, 2025, 1:52pm UTC](https://community.glideapps.com/t/css-hack-dynamic-css-in-glide/85080/4 "2025-10-27T13:52:08Z")

</div>

You’re right — for now, that’s the maximum achievable approach for navigation menu cases, unless each navigation button could have a CSS class name bound to Glide data (as suggested here: **[Allow “CSS Class Name” Field to be bound to data](https://community.glideapps.com/t/allow-css-class-name-field-to-be-bound-to-data/84977))**.

For other components, a **Rich Text** element placed on the same screen works fine and can be combined with any component as long as they share the same screen context.

There’s also another, more efficient path I recently discovered — through component attributes.  
For example, the **title header** of collection components such as **Card, List, Table, Data Grid, Checklist, Calendar, Kanban, and Map** has a `title` attribute that can be dynamically styled via CSS.  
Each changing value in this title can be “heard” by CSS using the selector pattern:

```auto
.title-header [title="Item"] {
  color: red;
  font-weight: 700;
}

```

 ![Screenshot 2025-10-26 154801](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/3/0/303cf2149548f7ccb4511e8032d7d11582711f42.png)

* * *

---

_[View the full topic](https://community.glideapps.com/t/css-hack-dynamic-css-in-glide/85080)._