DEV Community

Cover image for How to create Glitch Effect 🤖 Pure CSS

How to create Glitch Effect 🤖 Pure CSS

Roden on August 20, 2021

Introduction Today I would like to talk about how to make a Glitch effect using CSS. To do this, I will use one of the most popular options. This ...
Collapse
 
afif profile image
Temani Afif •

clip is deprecated, you should consider clip-path instead or mask.
Here is my idea using mask: dev.to/afif/still-100-css-loaders-... (loader #5 in the Classic IV)

Collapse
 
kerthin profile image
Roden •

Thank you for advice. I know that the clip property is already outdated, I just didn't want to recycle the working vanilla version. 😊

Collapse
 
afif profile image
Temani Afif •

yes, but it may stop working at any time 😉

Thread Thread
 
kerthin profile image
Roden •

Here you are definitely right, I should then redo it to clip-path. Thanks

Collapse
 
spock123 profile image
Lars Rye Jeppesen •

Very cool man, cheers

Collapse
 
kerthin profile image
Roden •

Thanks 🎉

Collapse
 
breero profile image
Bree Owen •

Wow this is so cool thank you for sharing!!!

Collapse
 
kamori profile image
Tyler Coil •

This is excellent! Now I know how to give my old geocities site the look and feel it deserves. With lagging scrolling and everything

Collapse
 
ayoaduwo profile image
Fola •

Wow!

Collapse
 
abrahamn profile image
Abraham •

How to*

But good article

Collapse
 
breero profile image
Bree Owen •

Do you have instructions for doing this with a picture instead of text?

Collapse
 
kerthin profile image
Roden •

Unfortunately, not yet, I planned to make them in the future.

Collapse
 
hiddon11 profile image
hiddon11 •

This is really helpful while developing AppLinked App. Get it from applinked.me/