Search This Blog

Swag wala Code

Contact Us

Get link
Facebook
X
Pinterest
Email
Other Apps

Quick Contact

Contact us today, and get reply with in 24 hours!

Get link
Facebook
X
Pinterest
Email
Other Apps

Comments

Text Shaking Effect Using HTML and CSS3

Text Shake Animation in HTML And CSS3 HTML CODE <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>css shake effect</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>shake effect!</h1> </body> </html> CSS Code(style.css) html, body { height: 100%; margin: 0; } body { display: flex; justify-content: center; align-items: center; font-family: monospace; background: #000; } h1 { position: relative; text-transform: uppercase; letter-spacing: 6px; font-size: 10vw; font-weight: 900; text-decoration: none; color: white; display: inline-block; background-size: 120% 100%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background...

create 3D image hover effect using html and css

3D Image Hover Effect in CSS3 HTML CODE <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="refresh" content="4000"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>3D Hover Effect</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="row"> <div class="tdimension"> <a href="#"> </a> </div> </div> </div> </body> </html> CSS Code(style.css) body { background: #ECECEC; } .container { width: 100wh; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; } .row { margin-top: 12px; } .tdimension { width: 300px; height: 300px; margin: 20px ...

Domino's Logo using HTML & CSS3

Domino's Logo Using CSS HTML CODE <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="refresh" content="3"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Domino's Logo</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="dominos"> <span class="d1"></span> <span class="d2"></span> </div> <script src="codee.js"></script> </body> </html> CSS Code(style.css) body { background-color: #333; text-align: center; } .dominos { background-color: #fff; display: inline-block; font-size: 0; padding: 5px; border-radius: 30px; margin: 150px 20px 20px 20px; transform: rotate(-45deg); } .d1 { background-color: #0079ae; width: 250px; ...