CSS snippets help, reducing intensity of markdown tokens and more

Hello!

I’m new to Obsidian and currently working on finding a good setup. I would like to achieve a few things with CSS snippets in order to stay in editor view (source mode) most of the time, namely:

  1. Render horizontal lines (--- / ***) as actual lines
  2. Reduce the intensity of the italics and bold markdown tokens (as well as the horizontal line tokens)
  3. Render images directly in the editor view

For rendering horizontal lines the following snippet seems to work:

span.cm-hr {
  border-top: 1px solid;
  display: block;
  line-height: 0px;
}

But ideally I’d like these tokens to be reduced in intesity as well, as such:

from-this

to-this

Is that possible? I’m using the Minimal Theme, which seemes to make the asterisks more rather than less noticable:

minimal-theme-token

Not sure if that can be removed?

To reduce the italics and bold markdown tokens I tried the following snippet:

span.cm-em.cm-rm-em-token,
span.cm-strong.cm-rm-strong-token {
	opacity: 0.5;
}

It doesn’t work though. I’ve tried playing around with the Developer Tools, but since I have no experience it’s hard to figure out.

Regarding rendering images directly: I looked for plugins and “CodeMirror Options” seems to be the only plugin that allow this(?) But if it could be achieved with just a CSS snippet I would prefer that.

If someone could help me out it would be much appreciated!