- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Applying Sepia Effect to Images using CSS3
To apply sepia effect to images using CSS3, use the sepia value for filter property.
Example
The code is as follows −
<!DOCTYPE html>
<html>
<head>
<style>
img.demo {
filter: sepia(100%);
}
</style>
</head>
<body>
<h1>Learn Spring Framework</h1>
<img src="https://www.tutorialspoint.com/spring/images/spring-mini-logo.jpg" alt="Spring Framework" width="160" height="150">
<h1>Learn Spring Framework</h1>
<img class="demo" src="https://www.tutorialspoint.com/spring/images/spring-mini-logo.jpg" alt="Spring Framework" width="160" height="150">
</body>
</html>Output
Updated on 30-Dec-2019 10:27:37
- Related Questions & Answers
- Applying Opacity to Images using CSS3
- Applying Hue Rotation on Image using CSS3
- Adding Drop Shadow to Images using CSS3
- Adjusting the Saturation of Images using CSS3
- Adding CSS3 Border Images
- How to convert a colored image to Sepia image using Java OpenCV library?
- Reading images using Python?
- Convert Images to PDFs using Tkinter
- Converting an Image to Grayscale using CSS3
- Applying Box Blur to an image using the Pillow library
- Applying Gaussian Blur to an image using the Pillow library
- Applying rank filter to an image using the Pillow library
- Setting Column Gap using CSS3
- Breaking Overflow Text using CSS3
- Performing multiple transitions using CSS3
Advertisements