CSS is AWESOME

Developer
Diéssica Gurskas
Size
3,349 Kb
Views
8,096
  1. CSS is AWESOME Previews
  2. CSS is AWESOME HTML Codes
  3. CSS is AWESOME CSS Codes

How do I make an css is awesome?

...amazing & powerful! Don't you think? :P. What is a css is awesome? How do you make a css is awesome? This script and codes were developed by Diéssica Gurskas on 10 January 2023, Tuesday.

CSS is AWESOME Previews
IQ Test

CSS is AWESOME - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>CSS is AWESOME</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Codystar|Megrim'> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ body { background: url(http://neilcarpenter.com/demos/asfalt.png); position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 45em; height: 35em; margin: auto; text-align: center; color: #fff; font-family: "Codystar"; letter-spacing: 0.4em; overflow: hidden;
}
h1 { margin-right: 0.15em; font-weight: bold; font-size: 17em; font-family: "Megrim"; color: #8e44ad; text-shadow: 0 0 0.1em black; letter-spacing: 0em; animation: space 1.5s forwards ease-out; animation-delay: 3.3s;
}
h1 span { display: inline-block;
}
h1 span:nth-child(1) { animation: fall 1s forwards ease-out alternate;
}
h1 span:nth-child(2) { animation: fall2 1.5s forwards ease-out alternate;
}
h1 span:nth-child(3) { animation: fall3 2s forwards ease-out alternate;
}
h2 { font-size: 3em; text-shadow: 0 1em 0.1em black; margin-bottom: 0.15em;
}
h2:nth-child(2) { animation: fall2 3.7s forwards ease-in-out alternate;
}
h2:nth-child(3) { font-size: 4.5em; animation: fall3 3.9s forwards ease-in-out alternate;
}
h2:nth-child(4) { font-size: 2.8em; animation: fall 4.2s forwards ease-in-out alternate;
}
@keyframes space { to { letter-spacing: -0.17em; }
}
@keyframes fall { 0% { transform: translateY(-50em); }
}
@keyframes fall2 { 0% { transform: translateX(-50em); }
}
@keyframes fall3 { 0% { transform: translateX(50em); }
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <h1><span>C</span><span>S</span><span>S</span></h1>
<h2>is awesome</h2>
<h2>amazing</h2>
<h2>& powerful.</h2>
</body>
</html>

CSS is AWESOME - Script Codes CSS Codes

body { background: url(http://neilcarpenter.com/demos/asfalt.png); position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 45em; height: 35em; margin: auto; text-align: center; color: #fff; font-family: "Codystar"; letter-spacing: 0.4em; overflow: hidden;
}
h1 { margin-right: 0.15em; font-weight: bold; font-size: 17em; font-family: "Megrim"; color: #8e44ad; text-shadow: 0 0 0.1em black; letter-spacing: 0em; animation: space 1.5s forwards ease-out; animation-delay: 3.3s;
}
h1 span { display: inline-block;
}
h1 span:nth-child(1) { animation: fall 1s forwards ease-out alternate;
}
h1 span:nth-child(2) { animation: fall2 1.5s forwards ease-out alternate;
}
h1 span:nth-child(3) { animation: fall3 2s forwards ease-out alternate;
}
h2 { font-size: 3em; text-shadow: 0 1em 0.1em black; margin-bottom: 0.15em;
}
h2:nth-child(2) { animation: fall2 3.7s forwards ease-in-out alternate;
}
h2:nth-child(3) { font-size: 4.5em; animation: fall3 3.9s forwards ease-in-out alternate;
}
h2:nth-child(4) { font-size: 2.8em; animation: fall 4.2s forwards ease-in-out alternate;
}
@keyframes space { to { letter-spacing: -0.17em; }
}
@keyframes fall { 0% { transform: translateY(-50em); }
}
@keyframes fall2 { 0% { transform: translateX(-50em); }
}
@keyframes fall3 { 0% { transform: translateX(50em); }
}
CSS is AWESOME - Script Codes
CSS is AWESOME - Script Codes
Home Page Home
Developer Diéssica Gurskas
Username diessica
Uploaded January 10, 2023
Rating 4
Size 3,349 Kb
Views 8,096
Do you need developer help for CSS is AWESOME?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Diéssica Gurskas (diessica) Script Codes
Name
Colunas de mesma altura
CSS Tube explodes
A CSS curve
How checkbox hack works
Pure CSS Waves
CSS Lasers
Floating labels with CSS only
CSS Sine Waves
Equal Height Columns Sass mixin
Hover to show the text
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!