The
<mark>tag in HTML is used to highlight text, typically to indicate relevance or search results.
Browsers usually render it with a yellow background by default.
It is an inline element and does not change the text’s semantic importance beyond visual highlighting.
Syntax
<mark>Highlighted text here</mark>Attribute
| Attribute | Description |
|---|---|
class | Assigns one or more class names for styling. |
id | Assigns a unique identifier to the highlighted text. |
style | Adds inline CSS styles to customize appearance. |
title | Provides additional information as a tooltip. |
Example
<!DOCTYPE html>
<html>
<head>
<title>MARK Tag Example</title>
<style>
.highlighted {
background-color: #ffeb3b;
color: #000;
padding: 2px 4px;
border-radius: 2px;
}
</style>
</head>
<body>
<h1>HTML <mark> Tag Example</h1>
<p>
This is an example of <mark class="highlighted" id="search-term" title="Highlighted Text">highlighted text</mark> in a paragraph.
</p>
<p>
Example: The keyword <mark>HTML tutorial</mark> was found in the search results.
</p>
</body>
</html>Output
Browser Output
Use our TryIt Editor to see the output.
Browser Support
 Chrome |  Firefox |  Edge |  Safari |  Opera |  IE9+ |
|---|---|---|---|---|---|
| ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes | ✅Yes |
The <mark> tag visually highlights text, making it stand out, typically with a yellow background.
It is commonly used to indicate search keywords or important passages.
Notes
<mark>is an inline element and preserves surrounding text flow.- The default highlight color can be changed using CSS for background and text color.
- It is semantic for highlighted content, useful for marking relevant information or search results.
- Avoid overusing
<mark>to prevent visual clutter.
Conclusion
The <mark> tag is a visual highlighting element that draws attention to important text or search results.
It improves readability and focus without changing the semantic importance of the surrounding content.
