Change colour of specific internal link?

[Sadim]

What I’m trying to do

I have quite a lot of links, which I want to categorise further. So I would like to be able to colour different (internal) links different colours.

Things I have tried

After trying a few CSS snippets it seems like

[[Page\|test link]]

basically is the same as (when in reading mode)

<div class="markdown-preview-view"><a class="internal-link" href="Page">test link</a></div>

So I hoped that one could put another div around it to force a different colour:

<div class="t">[[Page\|test link]]</div>

CSS:

div.t {
    color: red !important;
}

but then

<div class="t">test [[Page\|test link]]</div>

only turns the text “test” red, but not the link. The only thing I could find was people trying to change the colour of all internal links not specific ones.

[ariehen]

You could try something like this:

<a href="test link.md" class="internal-link"><span class="t">Page</span></a>

.t {
    color: red;
}

See →

Allow [[Internal Links]] inside html tags

Use case or problem Allow [[Internal Links]] inside html tags. Links are not interpreted by obsidian. Proposed solution Example 1 : <p>[[Example]]</p> Example 2 : <details> <summary>Click here to view details</summary> <ul> <li>[[Internal link 1]]</li> <li>[[Internal link 2]]</li> </ul> </details>

[Sadim]

Thank you it worked!

[mr_abomination]

You might also want to check out the Supercharged Links plugin, it may have some of the functionality you’re looking for.

Plus, if you’re planning on doing a refactor on a large number of notes, this could help speed up the process.

[Sadim]

Thank you, it worked very well!