Advertisement
ItsDanyAndre

Life is Colorful - Post

Oct 8th, 2020 (edited)
192
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 2.44 KB | None | 0 0
  1. <link href="https://fonts.googleapis.com/css2?family=Pacifico&family=Roboto&display=swap" rel="stylesheet"><div class="pantone1"> <div class="pantoneborde"> <div class="pantitlebord"></div><div class="pantonetitle">TITULO</div><div class="pantonetext"> <div class="pantonetext2"> TEXTO AQUI </div></div></div></div><div id="myscr"><a href="https://mystiqueworkshop.tumblr.com/">MYSTIQUE</a></div><style>.pantone1{--color1: #d1f2a5; --color2: #effab4; --color3: #ffa080; --color4: #f56991; --color5: #FFF;}.pantone1{margin: 0 auto; position: relative;width: 400px;height: 500px;background: var(--color1);background: linear-gradient(top, var(--color1) 0%, var(--color2) 16%, var(--color2) 37%, var(--color3) 66%, var(--color4) 85%, var(--color4) 100%);background: gradient(left top, left bottom, color-stop(0%, var(--color1)), color-stop(16%, var(--color2)), color-stop(37%, var(--color2)), color-stop(66%, var(--color3)), color-stop(85%, var(--color4)), color-stop(100%, var(--color4)));background: linear-gradient(to bottom, var(--color1) 0%, var(--color2) 16%, var(--color2) 37%, var(--color3) 66%, var(--color4) 85%, var(--color4) 100%);}.pantonetope{width: 400px; height: 50px; background: var(--color5); border: 0.5px solid var(--color1);}.pantoneborde{width: 350px; height: 380px; position: absolute; top: 16px; left: 20px; border-top: 80px solid var(--color5); border-bottom: 5px solid var(--color5); border-left: 5px solid var(--color5); border-right: 5px solid var(--color5);}.pantonetitle{font-family: 'Pacifico'; font-size: 30px; color: var(--color4); text-shadow: 2px 2px var(--color1); position: absolute; top: -65px; right: 10px;}.pantonetext{width: 310px; height: 340px; position: absolute; top: 10px; left: 10px; background: var(--color5); opacity: 0.6; padding: 10px;}.pantonetext2{width: 290px; height: 320px; overflow: auto; padding: 10px; font-family: 'roboto'; font-size: 12px; text-align: justify;}#myscr{font-family: 'Century Gothic'; font-size: 11px; text-align: center; color: #333 ; margin: 0 auto; margin-top: 1px;}#myscr a{color: #333;text-decoration: none;}.pantonetext2::-webkit-scrollbar{width:4px; height: auto; background-color: var(--color1);}.pantonetext2::-webkit-scrollbar-thumb:vertical{width: 6px; height:10px; background-color: var(--color3);}.pantonetext2::-moz-scrollbar{width:2px; height: auto; background-color: var(--color1);}.pantonetext2::-moz-scrollbar-thumb:vertical{width: 2px; height:10px; background-color: var(--color23);}</style>
  2.  
  3.  
  4.    
  5.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement