Skip to content

Instantly share code, notes, and snippets.

@DeadlyBrad42
Last active May 29, 2018 03:39
Show Gist options
  • Save DeadlyBrad42/3706853 to your computer and use it in GitHub Desktop.
Save DeadlyBrad42/3706853 to your computer and use it in GitHub Desktop.
Some cool text styles that I've stolen from around the Internet.
/* 3D analygraph */
.three-d
{
color:rgba(0,255,255,0.5);
text-shadow: rgba(255,0,0,0.5) -4px 0px 0px;
padding-left:4px;
}
/* Zombie */
@font-face {
font-family: 'Creepster';
font-style: normal;
font-weight: 400;
src: local('Creepster'), local('Creepster-Regular'), url(http://fonts.gstatic.com/s/creepster/v5/un014as1qOcrVg1hrkn_UVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
h1.zombie {
color: #bed63a;
font-family: 'Creepster', cursive, sans-serif;
font-size: 3.2em;
line-height: 1.1;
text-shadow: 0.002em 0.002em 0em #364000, 0.044em 0.044em 0 #9eb036, -0.042em -0.014em 0 #8f2472, 0.087em 0.074em 0 #8f2472, -0.074em 0.094em 0 #ca4f04, 0.074em 0.174em 0 #ca4f04;
}
/* Big Block of 3D Text from http://markdotto.com/playground/3d-text/ */
.BB3D
{
color: #FFFFFF;
font: bold 100px/1 "Helvetica Neue",Helvetica,Arial,sans-serif;
text-shadow: 0 1px 0 #ccc,
0 2px 0 #c9c9c9,
0 3px 0 #bbb,
0 4px 0 #b9b9b9,
0 5px 0 #aaa,
0 6px 1px rgba(0,0,0,.1),
0 0 5px rgba(0,0,0,.1),
0 1px 3px rgba(0,0,0,.3),
0 3px 5px rgba(0,0,0,.2),
0 5px 10px rgba(0,0,0,.25),
0 10px 10px rgba(0,0,0,.2),
0 20px 20px rgba(0,0,0,.15);
}
/****** From line25.com *******************************************************/
/* (http://line25.com/articles/using-css-text-shadow-to-create-cool-text-effects) */
/* Vintage Retro */
.vintage-retro
{
color: #707070;
font-family: "League-Gothic",Courier;
font-size: 200px;
margin: 200px auto;
text-align: center;
text-shadow: 5px 5px 0 #EEEEEE, 7px 7px 0 #707070;
text-transform: uppercase;
}
/* Neon */
.neon
{
color: #FFFFFF;
font-family: "Museo";
font-size: 200px;
margin: 200px auto;
text-align: center;
text-shadow: 0 0 10px #FFFFFF, 0 0 20px #FFFFFF, 0 0 30px #FFFFFF, 0 0 40px #FF00DE, 0 0 70px #FF00DE, 0 0 80px #FF00DE, 0 0 100px #FF00DE, 0 0 150px #FF00DE;
text-transform: uppercase;
}
/* Inset */
.inset
{
color: #222222;
font-family: "League-Gothic",Courier;
font-size: 200px;
margin: 200px auto;
text-align: center;
text-shadow: 0 2px 3px #666666;
text-transform: uppercase;
}
/* Fire */
.fire
{
color: #FFFFFF;
font-family: "League-Gothic",Courier;
font-size: 200px;
margin: 200px auto;
text-align: center;
text-shadow: 0 0 20px #FEFCC9, 10px -10px 30px #FEEC85, -20px -20px 40px #FFAE34, 20px -40px 50px #EC760C, -20px -60px 60px #CD4606, 0 -80px 70px #973716, 10px -90px 80px #451B0E;
text-transform: uppercase;
}
/* Board Game */
.board-game
{
color: #FFFFFF;
font-family: "League-Gothic",Courier;
font-size: 200px;
margin: 200px auto;
text-align: center;
text-shadow: 10px 10px 0 #FFD217, 20px 20px 0 #5AC7FF, 30px 30px 0 #FFD217, 40px 40px 0 #5AC7FF;
text-transform: uppercase;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment