Forum Settings
Forums

[CSS - Modern] CSS text shadow templates for flaming and glowing text

New
Mar 21, 2023 11:24 AM
#1

Offline
Feb 2010
11293
This topic is part of our CSS Tutorials and Add-ons section: https://myanimelist.net/forum/?topicid=2077862



When you have a selector containing text, you can edit the text via codes like color for text, font-size for text size etc. These codes are similar for adding cool effects to text via CSS! :D


Add these codes to any section that has text and it should add the effect to text as seen in the picture. You can change the colors if you want. Some colors are an HTML color, get more such colors here:
https://myanimelist.net/forum/?topicid=1909051

If you want a quick example you can just use the universal selector * to edit the entire list's text, something like:



More text shadow templates can be made here: https://html-css-js.com/css/generator/text-shadow/




color: white !important;

text-shadow:
red 1px 1px 4px, 
black 1px 1px 4px,
#FF2D95 0px 0px 20px, 
#FF2D95 0px 0px 15px, 
#FF2D95 0px 0px 20px, 
#FF2D95 0px 0px 30px, 
#FF2D95 0px 0px 45px;






color: white !important;

text-shadow: 
1px 1px 4px black, 
1px 1px 4px black, 
1px 1px 4px black, 
1px 1px 4px black,
 1px 1px 4px black, 
 1px 1px 6px black,
 1px 1px 7px black, 
 1px 1px 10px black;







color: white !important;

text-shadow:1px 1px 4px red, 
1px 1px 4px black,
 0 -2px 10px #ff0, 
0 -10px 20px #ff8000, 
0 -18px 40px #F00,
0 -2px 10px #ff0, 
0 -10px 20px #ff8000, 
0 -18px 40px #F00;






color: white !important;

text-shadow: 
#FFF 0px 0px 5px, 
#FFF 0px 0px 10px, 
#FFF 0px 0px 15px, 
#FF2D95 0px 0px 20px,
 #FF2D95 0px 0px 30px, 
 #FF2D95 0px 0px 40px, 
 #FF2D95 0px 0px 50px,
 #FF2D95 0px 0px 75px;






color: white !important;

text-shadow: 
black 1px 1px 4px, 
red 1px 1px 4px,  
#FFF 0px 0px 5px, 
#FFF 0px 0px 10px, 
#FFF 0px 0px 15px, 
#FF2D95 0px 0px 20px, 
#FF2D95 0px 0px 30px, 
#FF2D95 0px 0px 40px, 
#FF2D95 0px 0px 50px, 
#FF2D95 0px 0px 75px;





color: white !important;

text-shadow:
purple 1px 1px 4px, 
black 1px 1px 4px ,
#0aa5ff 0px 0px 20px, 
#0aa5ff 0px 0px 15px, 
#0aa5ff 0px 0px 20px, 
#0aa5ff 0px 0px 30px, 
#0aa5ff 0px 0px 45px;


Shishio-kunMar 21, 2023 12:07 PM
Reply Disabled for Non-Club Members
Reply Disabled for Non-Club Members

More topics from this board

» [CSS - MODERN] ⭐️ All ways to customize individual anime and individual list rows (mark your favorites!)

Shishio-kun - Sep 4, 2020

12 by takkun_ »»
May 12, 12:00 AM

» [CSS - MODERN] ⚡️ Fully-Customizable Layouts (2023 updates!) ( 1 2 3 4 5 ... Last Page )

Shishio-kun - Jul 21, 2017

359 by CLModerno »»
May 5, 7:50 PM

» [CSS - MODERN] Add side renders to list layouts (including for each category!)

Shishio-kun - May 15, 2021

3 by gwynsyl »»
May 5, 1:41 PM

» ❓ Ask for help here + See Frequently Asked Questions ( 1 2 3 4 5 ... Last Page )

Shishio-kun - Apr 15, 2010

7819 by Nunphell »»
May 5, 12:35 PM

» [HALL OF LEGENDS] Hacker09, MyAnimeList's #1 coder!

Shishio-kun - Dec 10, 2023

9 by hacker09 »»
May 2, 9:29 PM
It’s time to ditch the text file.
Keep track of your anime easily by creating your own list.
Sign Up Login