It’s just crazy, the CSS & JS text effects you can do these days. From glitch effects to blending modes, every time I think I’ve seen it all, some creative coder comes along and makes something on CodePen that leaves me wondering “How the heck does that work?”.

Needing to make some CSS animations for menus, loaders, I decided to also put together a list of impressive CSS text effects that you can only find on CodePen. Enjoy!

This is so not what a neon sign looks like, but I stumbled on the effect on accident and thought it looked cool.

A neat exploding particle text effect using JS and CSS.

See the Pen Particle Text Effect by tomncurry (@tomncurry) on CodePen.

A cool SVG text effect that resembles worms moving on letters and changing colors.

Glitch sort of tect effect with CSS animation.

I've changed the font to Montserrat and added CSS3 browser prefixes so the animation works right out of the box across browsers.

This neat retro VHS text effect was coded using CSS and Javascript.

See the Pen VHS Text Effect by Shorina (@Shorina) on CodePen.

Uses `-webkit-background-clip: text` & `linear-gradient` to simulate striped text shadow.

This pen shows text that looks like it is peeled of the page. It has a smooth animation when hovered. For accessibility reasons, I've added an `aria-label` to the paragraph.

See the Pen Peeled Text Transforms by Michiel (@Michiel) on CodePen.

A simple SVG intro text effect perfect for landing pages.

See the Pen Animating SVG Text by supah (@supah) on CodePen.

Variable long shadow text effect using only CSS gradients mixin.

Path drawing of text using greensock's drawSVG plugin.

See the Pen Text Color Draw by cjgammon (@cjgammon) on CodePen.

Neat slide and fade in text effect using pure CSS animation.

I really liked what they did with the text over at http://panda.network/ so I thought I'd have a crack at making my own implementation here.

A pretty cute text shadow effect using only CSS.

See the Pen Pretty Shadow Effect by MoorLex (@MoorLex) on CodePen.

A smooth glitch text effect done with some simple CSS animations.

See the Pen Glitch Text Effect by zoite (@zoite) on CodePen.

My first try at canvas. Didn't turn out as nice as I'd hoped, but whatever.

CSS-only glitch text effect that looks awesome.

See the Pen Glitch Effect by cbp (@cbp) on CodePen.

Animated colorful text effect from left to right.

See the Pen Colorful Text Animation by hendrysadrak (@hendrysadrak) on CodePen.

A simple text effect using [Greensock] GSAP (https://greensock.com/gsap).

See the Pen GSAP Text Animation by natewiley (@natewiley) on CodePen.

CSS glitched text effect using skewed angles.

A neat trick using text mask background moving on mouse move.

This pen was inspired by webdesignerdepot's new design, the title on each article will be highlighted when user hovered it.

Text animation inspired by Web Designer issue 241.

An experiment using webfonts in combination with CSS 3D transform tools.

An awesome wave text effect using CSS animation.

See the Pen Happy Text Effect by bennettfeely (@bennettfeely) on CodePen.

A well-made glitched text animation.

See the Pen Glitchy Text by mattstvartak (@mattstvartak) on CodePen.

A cool SVG text effect that looks like spaghetti forming letters.

Make text design (typography) with neon effect.

Fill your text with animated background images – no Javascript required, Webkit only.

A jQuery powered example of how you can create a bubbling effect on a HTML heading. The bubbles appear as though they're coming from behind the text, and then fade out and are removed.

See the Pen Bubbling Text Effect by html5andblog (@html5andblog) on CodePen.

GSAP text animation. SVG path shattering. Slow motion on hover.

See the Pen Shattering Text Animation by ARS (@ARS) on CodePen.

An awesome retro 3D text effect using SVG and CSS.

Work with this feels like an old good Flash.

Another well-executed glitch effect on text using CSS and JS.

See the Pen CSS Glitched Text by derekjp (@derekjp) on CodePen.

A lovely and bulky 3D text effect made with CSS. Renders best in Chrome.

See the Pen 3D CSS Typography by noahblon (@noahblon) on CodePen.

Animated ocean wave effect using SVG blend mode and CSS.

Shaded Text, a SVG+CSS3 experiment about animated shadows. It isn't optimized for mobile devices… yet.

See the Pen Shaded Text Effect by rgg (@rgg) on CodePen.

Using [GreenSock](http://greensock.com/gsap) and the [SplitText](http://greensock.com/SplitText) plugin to create a 3D text effect for #Codevember #7 day 9.