Member-only story
CSS for Roam (2nd lesson): Power of #tags and [[pages]]
And slightly disappointing attributes
Last update: 27th December 2020
In the first lesson, we looked at all possibilities how we can customize Roam: HTML, CSS and JavaScript. Last time, we created our very first little custom CSS: We turned the page title red. That was great! But admittedly not very useful. This time we will explore two extremely powerful elements in Roam that are probably not only most commonly customized but also their customization brings the largest benefits: They are hashtags (#tags) and [[pages]].
Before we start, a small remainder regarding the internal structure of Roam: These are the same thing:
- [[something]] — pages
- #something — hashtags
- something:: — attributes
Don’t you believe me? Simply try to write them in Roam, click on any of them and you will be teleported to the very same page. This unity (or rather a trinity) is one of the great powers of Roam.
Unfortunately, it is not perfect yet. At this moment, attributes are considered somewhat experimental and they cannot be customized in the same way as the other two. If we want to use pure CSS, we can style them only in a general fashion. On the other hand, [[pages]] and…
