41 CSS Text Effects
CSS Text Effects enhance typography by adding visual interest, interactivity, and animation to your content - without needing JavaScript. From simple bold or italic styling to advanced effects like animated gradients, typewriter animations, and glowing neon shadows, CSS lets you transform plain text into dynamic design elements.
Bold / Italic / Underline / Uppercase
Basic text styling properties
Letter Spacing
Control spacing between letters
Line Height Adjustment
Control vertical spacing between lines
Text Alignment
Different text alignment options
Text Indent
Indent the first line of text
Word Wrap / Break / Ellipsis
Control how text wraps and breaks
Gradient Text
Text with gradient color effects
Multi-color Text
Different colors for different parts of text
Text with Background Clip
Text clipped to show background image
Transparent Text with Background Image
Transparent text revealing background
Animated Gradient Text
Text with moving gradient animation
Simple Text Shadow
Basic text shadow effects
Multi-layered Shadow
Multiple shadow layers for depth
Neon Glow Text
Bright neon glow effect
Soft Glow
Subtle soft glow effect
Shadow on Hover Only
Shadow appears only on hover
Outer vs Inner Shadow Effect
Comparison of outer and inner shadows
Typing / Typewriter Effect
Animated typing effect
Flickering Text
Text with flickering animation
Slide In Text
Text sliding in from different directions
Fade In / Fade Out
Text fading animations
Scale Up / Down
Text scaling animations
Rotate Text
Text rotation animation
Wave Text Animation
Letters moving in wave pattern
Pulse or Bounce Text
Text with pulsing and bouncing effects
3D Text
3D text effect using transform and shadow
Outlined / Stroke Text
Text with outline stroke effect
Blurred Text
Text with blur effects
Cut-out / Hollow Text
Text with cut-out effect
Text Masked by Image
Text with image mask effect
Broken Text Effect
Text with broken/glitch effect
Vertical Writing
Vertical text orientation
Split Text on Hover
Text splits apart on hover
Mirrored / Reflected Text
Text with mirror reflection effect
Gradient Border Around Text
Text with gradient border effect
Color Change on Hover
Text color changes on hover
Underline Reveal from Left to Right
Underline animates from left to right
Stroke Fill on Hover
Text stroke fills with color on hover
Letter-by-letter Animation
Each letter animates individually on hover
Expand Letter Spacing on Hover
Letter spacing expands on hover
Word-by-word Animation Delay
Each word animates with delay