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
 
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
 
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
 
abrahamn profile image
Abraham

How to*

But good article

Collapse
 
breero profile image
Bree Owen

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

Collapse
 
spock123 profile image
Lars Rye Jeppesen

Very cool man, cheers

Collapse
 
kerthin profile image
Roden

Thanks šŸŽ‰

Collapse
 
ayoaduwo profile image
Fola

Wow!

Collapse
 
hiddon11 profile image
hiddon11

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