gif + big text

[millennialfalcon]

open post

voice ✦ video ✦ text ✦ action

CODE

---

how's my driving?

IP off ✦ anon on ✦ comments screened

CODE

---

navigation

app ✦ inbox ✦ hmd ✦ permissions

CODE

---

JUST TEXT:

<raw-code><center><div style="max-width:100%;width: 500px; height: 350px; background: url(IMGURL) center bottom; background-size: cover;display:flex;justify-content:center;align-items:center;"> <span style="color: #fff; text-transform: lowercase; font-size:60pt; font-weight:bold; text-shadow: 1px 1px 20px #ACCENTCOLOR;font-family:'FONT'">BIG TEXT</span> </div> <div style="letter-spacing:4px;font-family:'FONT';font-size:12pt;">THING 1 <span style="color:#ACCENTCOLOR;font-weight:bold;">✦</span> THING 2 <span style="color:#ACCENTCOLOR;font-weight:bold;">✦</span> THING 3 <span style="color:#ACCENTCOLOR;font-weight:bold;">✦</span> THING 4</div><br/> <div style="max-width:100%;width: 500px; text-align: right;"><a href="http://chriscodes.dreamwidth.org/" style="font-size:8px;letter-spacing:4px;text-decoration:none;color:#bbb;">CODE</a></div></center></raw-code>

WITH LINKS:

<raw-code><center><div style="max-width:100%;width: 500px; height: 350px; background: url(IMGURL) center bottom; background-size: cover;display:flex;justify-content:center;align-items:center;"> <span style="color: #fff; text-transform: lowercase; font-size:60pt; font-weight:bold; text-shadow: 1px 1px 20px #ACCENTCOLOR;font-family:'FONT'">BIG TEXT</span> </div> <div style="letter-spacing:4px;font-family:'FONT';font-size:12pt;"><a href="LINKURL" style="text-decoration: none; color:#LINKCOLOR;">THING 1</a> <span style="color:#ACCENTCOLOR;font-weight:bold;">✦</span> <a href="LINKURL" style="text-decoration: none; color:#LINKCOLOR;">THING 2</a> <span style="color:#ACCENTCOLOR;font-weight:bold;">✦</span> <a href="LINKURL" style="text-decoration: none; color:#LINKCOLOR;">THING 3</a> <span style="color:#ACCENTCOLOR;font-weight:bold;">✦</span> <a href="LINKURL" style="text-decoration: none; color:#LINKCOLOR;">THING 4</a></div><br/> <div style="max-width:100%;width:500px; text-align: right;"><a href="http://chriscodes.dreamwidth.org/" style="font-size:8px;letter-spacing:4px;text-decoration:none;color:#bbb;">CODE</a></div></center></raw-code>

THINGS TO REPLACE:

• IMGURL = your gif
  
• FONT = your font
  
• ACCENTCOLOR = the hex code of the color for the big text shadow and accent color between each item of text at the bottom
  
• BIG TEXT = the big text over the gif
  
• THING 1, 2, 3, 4 = the bits at the bottom, customize as necessary
  
• LINKURL = URL for your links
  
• LINKCOLOR = the hex code of the color for your links
  
  
• text-transform: lowercase; = (optional) remove if you want to be able to capitalize the big text

Comments

[seaurchin]

appears months later

thanks for this easy code, chris