# Task dynamic styling

**URL:** <https://community.silverbullet.md/t/task-dynamic-styling/3708>\
**Category:** Tricks & Techniques\
**Created:** [January 3, 2026, 3:10pm UTC](https://community.silverbullet.md/t/task-dynamic-styling/3708 "2026-01-03T15:10:40Z")\
**Posts on this page:** 1\
**Showing post:** 18

<div class="post-metadata">

**Author:** ![bau](https://community.silverbullet.md/user_avatar/community.silverbullet.md/bau/32/2597_2.png) [@bau](https://community.silverbullet.md/u/bau)\
**Post date:** [January 9, 2026, 8:18pm UTC](https://community.silverbullet.md/t/task-dynamic-styling/3708/18 "2026-01-09T20:18:59Z")

</div>

Evolution proposal 1740 was integrated yesterday, by @zef , into the Edge (pre-release) version of Silverbullet.

When generating the html code (backend of md pages) by Silvebullet, a span is added to the description of the attributes it encapsulates.

This span is associated:

- to a new class: “sb-attribute”
- to an attribute (in the HTML sense) which conveys the name of the attribute (in the Silverbullet sense) and its value, which allows this information to be manipulated like a CSS selector.

This will make, among other things, customizing the display of a task much easier.

Example of the new structure for a task attribute:

```auto
<span class="sb-list sb-task"> TODO </span>
 
<span class="sb-attribute" data-statut="ok">

<span class="sb-list sb-frontmatter sb-meta">[</span>
<span class="sb-list sb-frontmatter sb-atom">statut</span>
<span class="sb-list sb-frontmatter sb-meta">: </span>
<span class="sb-list sb-frontmatter">ok</span>
<span class="sb-list sb-frontmatter sb-meta">]</span>

</span>

```

**CSS rule example with new components:**

- background of all atributs elements :  
.sb-attribute[data-statut] { background-color: red;}

- background of the value alone:  
.sb-attribute[data-statut] \> .sb-list.sb-frontmatter:not(.sb-meta):not(.sb-atom) { background-color: red;}

---

_[View the full topic](https://community.silverbullet.md/t/task-dynamic-styling/3708)._