The semantic elements
HTML offers meaning aware elements for crossed out text. The <del> element marks content that has been removed, and <ins> marks content that has been added, which pair naturally for edits. The <s> element indicates text that is no longer accurate or relevant, such as an old price.
Styling with text-decoration
When you only need the visual line without a specific meaning, apply text-decoration: line-through in CSS. You can control the colour and thickness with text-decoration-color and text-decoration-thickness, which is how this very site draws its red strike accents.
Keeping it accessible
The semantic elements communicate intent to assistive technology, which is why they are preferred over a bare CSS line for meaningful changes. Reserve plain text-decoration for decorative cases, and use del and ins when the change carries meaning.
When Unicode is still right
Unicode strikethrough belongs in plain text environments such as chat apps and social bios, where you cannot write HTML. On your own web pages, always prefer the markup approach, which is cleaner, more accessible, and easier to style.
Frequently Asked Questions
The <s> element marks text that is no longer accurate, while <del> marks text that has been removed, often paired with <ins>.
Use text-decoration-color alongside text-decoration: line-through to set a custom colour.
No. On web pages use semantic HTML and CSS, which are more accessible and easier to maintain.
Yes. Semantic HTML and CSS strikethrough render in modern mobile browsers without any special font or script.
The visual line remains on the web page, but copying may carry only the words. Use Unicode when the crossed-out appearance must travel as plain text.
Use it sparingly, keep the phrase short, and provide the intended meaning in nearby plain text because screen readers may not announce the visual line.
