A cool text style I found that uses only text-shadow
A Pen by ThatGuySam on CodePen.
Swati Kothari swati16
swati16
/ hit-the-floor-text-effect.markdown
Created
December 4, 2018 04:56
Hit The Floor Text Effect
A Pen by Jorge Epuñan on CodePen.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- | |
| autor: Marco Barría | |
| https://twitter.com/marco_bf | |
| --> | |
| <div class="text"> | |
| <svg> | |
| <defs> | |
| <mask id="mask" x="0" y="0" width="100%" height="100%" > | |
| <!-- alpha rectangle --> | |
| <!-- rectángulo alfa --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <ul class="text hidden"> | |
| <li>N</li> | |
| <li class="ghost">T</li> | |
| <li class="ghost">T</li> | |
| <li>D</li> | |
| <li class="ghost">A</li> | |
| <li class="ghost">T</li> | |
| <li class="ghost">A</li> | |
| <li class="spaced">D</li> | |
| <li class="ghost">e</li> |
swati16
/ css-text-revealing-animation.markdown
Created
December 4, 2018 05:04
CSS TEXT REVEALING ANIMATION
A Pen by Nooray Yemon on CodePen.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <main role="main" class="main-content" id="main-content"> | |
| <div class="titleCont"> | |
| <h1 class="main-title" id="main-title"> | |
| "Here, in the forest,<br><span style="padding-left:100px">dark and deep,</span><br><span style="padding-right:110px">I offer you,</span><br><span style="padding-left:-20px">eternal sleep."</span> | |
| </h1> | |
| </div> | |
| <canvas id="noise" class="noise"></canvas> | |
| <div class="vignette"></div> | |
| </main> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- | |
| Follow me on | |
| Dribbble: https://dribbble.com/supahfunk | |
| Twitter: https://twitter.com/supahfunk | |
| Codepen: https://codepen.io/supah/ | |
| --> | |
| <h1 class="strip"> | |
| Work hard<br> |
swati16
/ codevember-3d-quote-rotator.markdown
Created
December 4, 2018 05:48
#Codevember 3D Quote Rotator
Using GreenSock and the SplitText plugin to create a 3D text effect for #Codevember #7 day 9.
Quotes about learning from goodreads
SplitText is a membership benefit of Club Greensock
A Pen by Nate Wiley on CodePen.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <figure> | |
| <svg x="0px" y="0px" viewBox="0 0 883 105.2" xml:space="preserve" overflow="visible"> | |
| <polygon points="359.9,49.6 359.8,49.7 359.9,49.8 "/> | |
| <polygon points="28,0 10.8,0 28,9 "/> | |
| <polygon points="28,12.6 0,46 0,51.9 28,48.9 "/> | |
| <polygon points="0.8,105 28,105 28,74.7 20.3,69.7 "/> | |
| <polygon points="28,9 10.8,0 0,0 0,46 28,12.6 "/> | |
| <polygon points="0,51.9 0,57.3 20,69.8 20,69.8 20,69.8 28,74.7 28,48.9 "/> | |
| <polygon points="0,57.3 0,105 0.8,105 20.1,69.7 "/> | |
| <polygon points="89.7,40.6 61,25.9 38,46 38,47.8 91,41.9 "/> |
OlderNewer