Changing the color/opacity of strikethrough text using CSS snippets

Custom CSS & Theme Design
1

What I’m trying to do

I want to change the color and/or opacity of the text w/ the strikethrough feature using css snippets.

Things I have tried

I managed to find information on automatically changing the color for bold and italic text, but nothing that helped with the strikethrough for editing/reading modes.

2

You could try something like this to start; the colors are separated by light and dark color schemes:

.theme-light :is(.cm-strikethrough, .markdown-preview-view del) {
    color: hsla(300, 100%, 25%, 0.5); /* light purple */
}

.theme-dark :is(.cm-strikethrough, .markdown-preview-view del) {
    color: hsla(6, 93%, 71%, 0.8); /* salmon */
}

You can use an rgba() or hex8 here as well to adjust color and opacity.

Moved to Custom CSS & Theme Design

3

Thank you! I’m still quite a beginner when it comes to editing with CSS, so thank you for your time!

1 Like
4

My pleasure! I enjoy mucking around with CSS in my free time. It’s usually relaxing :sweat_smile:

If the above was what you were looking for, you can click the solution box so others know it works and the topic is “solved”. If not, we can try something else.

1 Like