- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to override the default text selection color with CSS?
To override the default text selection color with CSS, the code is as follows −
Example
<!DOCTYPE html> <html> <head> <style> ::-moz-selection { color: rgb(255, 255, 255); background: rgb(118, 69, 231); } ::selection { color: rgb(255, 255, 255); background: rgb(118, 69, 231); } body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } p { font-size: 40px; } </style> </head> <body> <h1>Text selection color example</h1> <h2>Select some text to see the text selection color</h2> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto consequuntur fugiat doloremque adipisci vero iste soluta ea ut! Exercitationem rem dolore delectus modi repellat quo mollitia temporibus laudantium, alias itaque tempora, iure voluptatem non voluptas, deleniti laborum? Cum ducimus unde, vitae consequuntur nobis dignissimos similique officia possimus quis necessitatibus praesentium! </p> </body> </html>
Output
The above code will produce the following output −
On selecting some text the color changes as in the below screenshot −
- Related Articles
- How to set the color of a text with CSS
- How to change the selection color of text in IText using FabricJS?
- Emphasis text and color with CSS
- Setting Text Color Working with CSS
- How to Change Link Underline Color using text-decoration-color CSS
- Setting Text Color using CSS
- How do you change the default font color for all text in Matplotlib?
- Animate CSS text-decoration-color property
- How to return the color of the text with JavaScript?
- Set the color of the text decoration in CSS
- How to set the color of the text-decoration with JavaScript?
- Setting the element's text color using CSS
- How to make an android spinner with initial default text?
- How to change the color of active links with CSS
- How to change the color of focused links with CSS

Advertisements