Snap Builder Public Codes Library
Snap | Generators | Login | Browse | Search | Enter Code | Export Snap Builder Public Codes Library

 

Category: HTML5 Codes Library >> Text & Text Effects >> Glowing Text


Code Snippet </> Info


Snippet Name: Glowing Text

Description: Create glowing text without any use of images or javascript!


Example: View Code Demo

Note: Adjust the size of your H2 tag and color styles to your preference.

Author: SnapBuilder <snippets@snapbuilder.com>

Last Modified: 2015-08-26 22:24:37

Language: html5

Highlight Mode: css

Copy Codes: Use Free Notepad ++
Bookmark and Share

Snap HTML Code Editor:
Paste the source code, make changes and instantly see it in live preview.
Snap HTML Code Editor


  About Copying

<html> <head> <title>HTML5 CSS Glowing Text</title> <style> /* Begin HTML5 CSS Glowing Text */ /* == This Script Free To Use Providing This Notice Remains == */ /* == This Script Has Been Found In The http://snapbuilder.com Free Public Codes Library == */ body {font-family:verdana,arial,ms sans serif;font-size:90%;background-color:#000000;padding:50px;color:#ffffff;} a.link {color:#ffffff;} a:hover {color:#00ff00;} @media screen { @font-face { font-family:'Alfa Slab One'; font-style:normal; font-weight:400; src:local('Alfa Slab One'), local('AlfaSlabOne-Regular'), url('http://themes.googleusercontent.com/static/fonts/alfaslabone/v2/Qx6FPcitRwTC_k88tLPc-fn8qdNnd5eCmWXua5W-n7c.woff') format('woff'); } } h2 { text-align:center; font-family:'Alfa Slab One','helvetica neue', helvetica, arial, sans-serif; font-size:5em; font-weight:400; /* Only bottom two lines are actually required fo the glow effect */ color:#FFF; text-shadow:0 0 150px #FFF, 0 0 60px #FFF, 0 0 10px #FFF; } </style> </head> <body> <h2>Glowing Text</h2> <br /><br /> <div id="snippet"> [ This code example from <a href="http://snapbuilder.com/code_snippets/copy_code_snippet_130.html">Glowing Text</a> page. ] </div> </body> </html>


[ Snippet Options ]

 

© 2002 -  Snap Builder Public Codes Library