Css for ==highlight==

What I’m trying to do

As I know, there are 3 ways to decorate a text.

  1. Bold
  2. Italic
  3. Highlight:
**Bold** or __Bold__
*Italic* or _Italic_
==Highlight==

I’d like to know if I can change the style of ==Highlight==.
Now, it is highlighted with background color.
What I want is… to change the text color only without highlighting background.

1 Like

This?

/* Highlight EDITOR */

.cm-s-obsidian span.cm-formatting-highlight, .cm-s-obsidian span.cm-highlight {
    background-color: transparent;
    color: #DA70D6;
}


/* Highlight PREVIEW */

.markdown-preview-view mark {
    background-color: transparent;
    color: #CD0000;
}

Angel

3 Likes

Angel…

Thank you for your answer.

That’s exactly what I wanted.

1 Like

Welcome. Good to hear it does what you need.

Angel

Is that syntax for highlighting even vaguely standard Markdown?

(I ask because I might teach my md2pptx Markdown → PowerPoint open source converter to honour it.)

Used in several flavours of Markdown, but not standard.

Believe that the HTML tag of <mark> is supported universally.

<mark> text </mark>

Angel

1 Like

This is really great, thanks @Angel !

My flavor (uses rgba instead of background-color to allow for opacity adjustment):

.cm-s-obsidian span.cm-formatting-highlight,
.cm-s-obsidian span.cm-highlight {
  background: rgba(255, 255, 0, 0.15);
  color: rgba(255, 255, 120, 0.8);
}

.markdown-preview-view mark {
  background: rgba(255, 255, 0, 0.15);
  color: rgba(255, 255, 120, 0.8);
}
1 Like

Welcome. And thanks for sharing.

Angel

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.