HTML Academy
  • HTML Academy
  • Courses
  • Tutorials
  • Courses
  • Tutorials
  • Sign up
  • Log in
  • Home
  • Interactive courses
  • Advanced styling
  1. Introduction to Backgrounds 0/16
  2. Shadow Play 0/17
  3. Linear Gradients 0/23
  4. CSS filters 0/14
  5. Text Formatting 0/26
  6. Frames and Backgrounds 0/33

Chapter 4: CSS filters

12 tasks, 2 challenges

Let's master CSS filters together: we will learn how to apply filters to different elements as well as how to combine and animate them.

Start
1. Brightness and Contrast Task
2. Grayscale and Sepia Task
3. Invert and Saturate Task
4. Color Rotation, hue-rotate Task
5. Blur and Opacity Task
6. Shadow, drop-shadow Task
7. The Difference Between box-shadow and drop-shadow Task
8. Applying CSS Filters to Text Task
9. Challenge: Using Various Filters Challenge
10. Combination of Filters Task
11. Combining the drop-shadow Filters Task
12. Animating CSS Filters Task
13. Smooth Transitions and CSS Filters Task
14. Challenge: Filter Combinations Challenge

Cookies ∙ Privacy ∙ License Agreement ∙ About ∙ Contacts ∙ © HTML Academy OÜ, 2019−2025

VISAMastercard

Log in

or

Forgot your password?

Sign up

Sign up

or
Log in

Restore access

Have you forgotten your password or lost access to your profile? Enter your email connected to your profile and we will send you a link to restore access.

Forgot to connect your email to the profile? Email us and we’ll help.

We are using cookies to gather information which will help you use our website most effectively. You can read about this here or disable this feature if you want. By continuing to browse the site, you agree to our use of cookies.