https://www.duolingo.com/m.tastic

How to make shadows in a Duolingo post

m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

To make shadows, simply copy and paste the following code. Replace the first part with your text.

Shadows! {@style = text-shadow: 1.5px 1.5px 1.5px #bbb}

makes

Shadows! {@style = text-shadow: 1.5px 1.5px 1.5px #bbb}

2 years ago

57 Comments
This discussion is locked.


https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2
<h1>[CENTERED TEXT] {@style = text-align: center}</h1>

This text will stay in the center of the screen. {@style = background: #fff; font-size: 30px; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 5; padding: 10px}

<h1>Whoops, made a mistake. {@style = text-decoration: line-through}</h1> <h1>Comic Sans! {@style = font-family: "Comic Sans MS"}</h1> <h1>Where did your cursor go? {@style = cursor: none}</h1> <h1>The words are starting to tilt... {@style = -webkit-transform: rotateZ(2.5deg); transform: rotateZ(2.5deg); font-size: 50px}</h1>
2 years ago

https://www.duolingo.com/wildfood
wildfood
  • 25
  • 25
  • 14

Tilting words? Now that's impressive!

2 years ago

https://www.duolingo.com/sibhreach

Totally mad. Génial! Merci beaucoup! {@style = -ms-transform: rotate(157deg); -webkit-transform: rotate157deg); transform: rotate(157deg)}

2 years ago

https://www.duolingo.com/CodyORB
CodyORB
  • 24
  • 14
  • 7
  • 5

Woah! Super tilt. How Did you do that?

2 years ago

https://www.duolingo.com/sibhreach

LOL Well, take the tilt and just the # value right before deg and remember you can choose 01deg to 361deg :D I think mine was 127? Fun stuff!

2 years ago

https://www.duolingo.com/CodyORB
CodyORB
  • 24
  • 14
  • 7
  • 5

{@style=-webkit-transform:rotateZ(2.5deg);transform:rotateZ(220deg);font-size:25px}This is awesome!

2 years ago

https://www.duolingo.com/planetary-way

Whoa! Pretty cool tricks! Can you teach me how to do that?

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Comic Sans! {@style = font-family: "Comic Sans MS"}

Where did your cursor go? {@style = cursor: none}

The words are starting to tilt... {@style = -webkit-transform: rotateZ(2.5deg); transform: rotateZ(2.5deg); font-size: 50px}

2 years ago

https://www.duolingo.com/planetary-way

Cool! Thank you! {@style=cursor:none}

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

[CENTERED TEXT] {@style = text-align: center}

Whoops, made a mistake. {@style = text-decoration: line-through}

2 years ago

https://www.duolingo.com/GoColts6
GoColts6
  • 15
  • 10
  • 9
  • 7
  • 6
  • 6
  • 2

Nice updates! :D How did you make that text in the center of the screen?

2 years ago

https://www.duolingo.com/GoColts6
GoColts6
  • 15
  • 10
  • 9
  • 7
  • 6
  • 6
  • 2

Hey, why do the words in the middle of the screen disappear when I'm typing?

2 years ago

https://www.duolingo.com/CodyORB
CodyORB
  • 24
  • 14
  • 7
  • 5

{@style=-webkit-transform:rotateZ(deg);transform:rotateZ(2.5deg);font-size:50px} Hello

2 years ago

https://www.duolingo.com/games543
games543
  • 25
  • 22
  • 20
  • 11
  • 4
  • 2
  • 2
<h1>Cool tip. ☆Thanks!☆{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}</h1>

--┌─┐ ─┐{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
--│▒│ /▒/☆{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
--│▒│/▒/{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
☆│▒ /▒/─┬─┐{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
--│▒│▒|▒│▒│{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
┌┴─┴─┐-┘─┘{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
│▒┌──┘▒▒▒│{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
└┐▒▒▒☆▒ ┌┘{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}
☆└┐▒▒▒┌┘{@style = text-shadow: 2.0px 2.0px 1.5px#bbb}

2 years ago

https://www.duolingo.com/planetary-way

{@style = text-shadow: -10px 10px 10px #110}This is cool!

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Thanks :)

2 years ago

https://www.duolingo.com/CutiePie889

Test

What is Comic Sans? Hel-lo! It has worked! Thank you, good sire or madam. Could you, perchance, become my friend? I would call you Marvelous Tastistica! {@style = font-family: Comic Sans MS}

<h1>Oh, my! Shadows! How interesting. Thank you again, madam or sire. {@style = text-shadow: 1.5px 1.5px 1.5px #bbb}</h1>
2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

No problem :) My inner geek had a blast doing this.

2 years ago

https://www.duolingo.com/CutiePie889

Oh! What is inner geek? Maybe I do not have it, so I will not have fun!

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Umm... What? I meant that I'm a nerd at heart, so naturally I enjoyed playing around with the code and seeing what worked. But you don't have to be interested in computers to enjoy these tricks. I don't see what you find offensive.

2 years ago

https://www.duolingo.com/CutiePie889

Oh, no, I am not offended or think you are offensive! I think you are very nice! But I merely wanted to know what inner geek was, and you have answered the question! Thank you!

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Oh... :P Well, no problem. Sorry for the misunderstanding.

2 years ago

https://www.duolingo.com/planetary-way

Can you put the codes for the other 3 tricks you used?

2 years ago

https://www.duolingo.com/games543
games543
  • 25
  • 22
  • 20
  • 11
  • 4
  • 2
  • 2

Third trick: TEXT { @style = -ms-transform: rotate(-1deg); -webkit-transform: rotate-1deg); transform: rotate(-1deg) }

2 years ago

https://www.duolingo.com/planetary-way

Thank you! :){@style=-ms-transform: rotate(5deg);-webkit-transform: rotate(5deg); transform: rotate(-2deg)}

2 years ago

https://www.duolingo.com/games543
games543
  • 25
  • 22
  • 20
  • 11
  • 4
  • 2
  • 2

You're welcome!{@style = color: orange}

2 years ago

https://www.duolingo.com/d100
d100
  • 22
  • 12
  • 10
  • 2

Why do people downvote this ?

2 years ago

https://www.duolingo.com/SpaceFace123

ikr

2 years ago

https://www.duolingo.com/GoColts6
GoColts6
  • 15
  • 10
  • 9
  • 7
  • 6
  • 6
  • 2

Trolls downvote it for fun (or whatever) :P. Personally, I found this helpful, so I up voted it.

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Thanks :)

2 years ago

https://www.duolingo.com/SpaceFace123

it does not work help me

2 years ago

https://www.duolingo.com/CodyORB
CodyORB
  • 24
  • 14
  • 7
  • 5

no spaces at all in the code

2 years ago

https://www.duolingo.com/games543
games543
  • 25
  • 22
  • 20
  • 11
  • 4
  • 2
  • 2

Comic Sans...Testing.. Testing.. Cool. {@style = font-family: "Comic Sans MS"}

Is there a way to combine Comic Sans font with the Shadows?{@style = text-shadow: 5.5px 5.5px 5.5px #bbb}

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Comic Sans + Shadow {@style = font-family: "Comic Sans MS"; text-shadow: 1.5px 1.5px 1.5px #bbb}

2 years ago

https://www.duolingo.com/DuoFlash
DuoFlash
  • 25
  • 14
  • 11
  • 10
  • 9
  • 7
  • 7
  • 6
  • 4
  • 2
  • 2
  • 2

This so cool!!!!{@style=-ms-transform: rotate(-1deg);-webkit-transform: rotate-1deg);transform: rotate(-1deg)}

2 years ago

https://www.duolingo.com/Baron-Nashor

{@style = text-SO DO YOU ADD IT HERE?: 1.5px 1.5px 1.5px #bbb}

2 years ago

https://www.duolingo.com/Baron-Nashor

{@style = text-shadow: 1.5px 1.5px 1.5px #bbb}

2 years ago

https://www.duolingo.com/JoshMcSher
JoshMcSher
  • 18
  • 9
  • 7
  • 7
  • 7
  • 3
  • 3
  • 2

{@style = text-hello duolingo: 1.5px 1.5px 1.5px #bbb}

2 years ago

https://www.duolingo.com/J.Appleseed21
J.Appleseed21
  • 18
  • 12
  • 10
  • 9
  • 2
  • 2

Cool! Thank you!{@style = text-shadow: 1.5px 1.5px 1.5px #bbb}

2 years ago

https://www.duolingo.com/SpaceFace123

it does not work help me please

2 years ago

https://www.duolingo.com/J.Appleseed21
J.Appleseed21
  • 18
  • 12
  • 10
  • 9
  • 2
  • 2

Word! @style = text-shadow: 1.5px 1.5px 1.5px #bbb

Replace "Word!" with your word put { before @ and } at the end of text

2 years ago

https://www.duolingo.com/CutiePie889
<h1>Comic Sans! {@style = font-family: "Comic Sans MS"}</h1> <h1>Where did your cursor go? {@style = cursor: none}</h1> <h1>The words are starting to tilt... {@style = -webkit-transform: rotateZ(2.5deg); transform: rotateZ(2.5deg); font-size: 50px}</h1>

How would you do the others, such as "[centered text]" and "Whoops, made a mistake"?

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

[CENTERED TEXT] {@style = text-align: center}

Whoops, made a mistake. {@style = text-decoration: line-through}

2 years ago

https://www.duolingo.com/CutiePie889

Thank you, dear madam or sire!

2 years ago

https://www.duolingo.com/games543
games543
  • 25
  • 22
  • 20
  • 11
  • 4
  • 2
  • 2

Please, how do you do the "This text will stay in the center of the screen." thing?

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

This text will stay in the center of the screen. {@style = background: #fff; font-size: 30px; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 5; padding: 10px}

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Hello. {@style = color: #000 @style:hover = color: #e83}

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

TEXT {@style = color: #38e}

2 years ago

https://www.duolingo.com/brightori

{@style=background-image:-webkit-gradient( linear, eft top,right top,color-stop(0, #f22),color-stop(0.15, #f2f),color-stop(0.3, #22f),color-stop(0.45, #2ff),color-stop(0.6, #2f2),color-stop(0.75, #2f2),color-stop(0.9, #ff2),color-stop(1, #f22) );background-image:gradient( linear,left top,right top, color-stop(0, #f22),color-stop(0.15, #f2f),color-stop(0.3, #22f),color-stop(0.45, #2ff),color-stop(0.6, #2f2),color-stop(0.75, #2f2),color-stop(0.9, #ff2),color-stop(1, #f22) );color:transparent;-webkit-background-clip:text;background-clip:text;}woooooooohhooooo

2 years ago

https://www.duolingo.com/CodyORB
CodyORB
  • 24
  • 14
  • 7
  • 5

OOOOOOOOOH

2 years ago

https://www.duolingo.com/brightori

{@style=is that it ?text-shadow:1.5px.1.5px 1.5px#bbb}

2 years ago

https://www.duolingo.com/CodyORB
CodyORB
  • 24
  • 14
  • 7
  • 5

Huh?

2 years ago

https://www.duolingo.com/epictortoise23

Shadows! {@style = text-shadow: 1.5px 1.5px 1.5px #bbb}

2 years ago

https://www.duolingo.com/Chats_Chiens

{@style=DOES IT WORK?-shadow:1.5px1.5px1.5px#bbb}

2 years ago

https://www.duolingo.com/stapmoshun
stapmoshun
  • 25
  • 8
  • 5
  • 5
  • 2
  • 2
  • 2
  • 2
  • 173

aaand its gone.

2 years ago

https://www.duolingo.com/m.tastic
m.tastic
  • 25
  • 13
  • 11
  • 11
  • 8
  • 6
  • 5
  • 5
  • 2

Weird. Maybe they blocked it.

2 years ago

https://www.duolingo.com/stapmoshun
stapmoshun
  • 25
  • 8
  • 5
  • 5
  • 2
  • 2
  • 2
  • 2
  • 173

probably removed it ;-;

2 years ago
Learn a language in just 5 minutes a day. For free.