Esmes Vice Anim00ted SVG

Developer
Moses Holmström
Size
3,838 Kb
Views
14,168
  1. Esmes Vice Anim00ted SVG Previews
  2. Esmes Vice Anim00ted SVG HTML Codes
  3. Esmes Vice Anim00ted SVG CSS Codes
  4. Esmes Vice Anim00ted SVG JS Codes

How do I make an esmes vice anim00ted svg?

What is a esmes vice anim00ted svg? How do you make a esmes vice anim00ted svg? This script and codes were developed by Moses Holmström on 15 December 2022, Thursday.

Esmes Vice Anim00ted SVG Previews
IQ Test

Esmes Vice Anim00ted SVG - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Esmes Vice Anim00ted SVG</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"> <defs> <filter id="sofGlow" filterUnits="userSpaceOnUse" height="100%" width="100%" x="0%" y="0%"> <feMorphology operator="dilate" radius="1" in="SourceGraphic" result="thicken" /> <feGaussianBlur in="thicken" stdDeviation="3" result="blurred" /> <feColorMatrix in="blurred" type="matrix" result="pullback" values="1 0 0 0 0 0 1 0 0 0 -.25 0 1 0 0.3 0 0 0 0.5 0" /> <feBlend mode="screen" in2="SourceGraphic" in="pullback" /> </filter> </defs> <path class="esmes-e-1" d="M88.93,128.75H73.74a7.08,7.08,0,0,0-6.42,5.06l-2.71,10.13c-.75,2.8.91,5.06,3.71,5.06h0a7.08,7.08,0,0,0-6.42,5.06l-2.71,10.13c-.75,2.8.91,5.06,3.71,5.06H78.07"/> <path class="esmes-s-1" d="M86.54,159.28l-1.31,4.9c-.75,2.8.91,5.06,3.71,5.06H99.06a7.08,7.08,0,0,0,6.42-5.06l2.71-10.13c.75-2.8-.91-5.06-3.71-5.06H94.36c-2.8,0-4.46-2.27-3.71-5.06l2.71-10.13a7.08,7.08,0,0,1,6.42-5.06h10.13c2.8,0,4.46,2.27,3.71,5.06l-1.4,5.22"/> <path class="esmes-m" d="M112.45,169.25l9.5-35.44a7.08,7.08,0,0,1,6.42-5.06h0c2.8,0,4.46,2.27,3.71,5.06l-6.87,25.63,6.87-25.63a7.08,7.08,0,0,1,6.42-5.06h0c2.8,0,4.46,2.27,3.71,5.06l-9.5,35.44"/> <path class="esmes-e-2" d="M172.13,128.75H156.94a7.08,7.08,0,0,0-6.42,5.06l-2.71,10.13c-.75,2.8.91,5.06,3.71,5.06h0a7.08,7.08,0,0,0-6.42,5.06l-2.71,10.13c-.75,2.8.91,5.06,3.71,5.06h15.19"/> <path class="esmes-s-2" d="M169.74,159.28l-1.31,4.9c-.75,2.8.91,5.06,3.71,5.06h10.13a7.08,7.08,0,0,0,6.42-5.06l2.71-10.13c.75-2.8-.91-5.06-3.71-5.06H177.56c-2.8,0-4.46-2.27-3.71-5.06l2.71-10.13a7.08,7.08,0,0,1,6.42-5.06h10.13c2.8,0,4.46,2.27,3.71,5.06l-1.4,5.22"/> <path class="sun" d="M163,98.47a37,37,0,1,0-71.86-.27"/> <path class="sun-vegas" d="M171.5,90.47a37,38,0,1,0-88.86-.27"/> <path class="tri-bit-right" d="M186.89,122,193,111.5"/> <path class="tri-upper" d="M199.08,100.89,238.85,32H17.15l39.77,68.89"/> <path class="tri-bit-left" d="M63,111.5,69.11,122"/> <polyline class="tri-lower" points="101.44 178 128 224 154.56 178"/> <path class="wave-upper" d="M41.69,97.5c10.79,0,10.79,4,21.57,4s10.79-4,21.58-4,10.79,4,21.58,4,10.79-4,21.58-4,10.79,4,21.58,4,10.79-4,21.58-4,10.79,4,21.58,4,10.79-4,21.58-4"/> <path class="wave-lower" d="M193,111.5c-10.78,0-10.8-4-21.62-4s-10.83,4-21.67,4-10.83-4-21.67-4-10.83,4-21.67,4-10.83-4-21.67-4-10.84,4-21.62,4"/>
</svg> <script src="js/index.js"></script>
</body>
</html>

Esmes Vice Anim00ted SVG - Script Codes CSS Codes

html { min-height: 100vh; background-color: #111; background-image: -webkit-linear-gradient(top, #000 0%, #314 100%); background-image: linear-gradient(to bottom, #000 0%, #314 100%);
}
svg { height: 100%; position: absolute; top: 0; left: 0; -o-object-fit: contain; object-fit: contain; width: 100%;
}
.esmes-e-1, .esmes-s-1, .esmes-m, .esmes-e-2, .esmes-s-2,
.sun, .sun-vegas,
.tri-upper, .tri-lower, .tri-bit-left, .tri-bit-right,
.wave-upper, .wave-lower { fill: none; -webkit-filter: url(#sofGlow); filter: url(#sofGlow); stroke-linecap: round; stroke-linejoin: round; stroke-width: .12em;
}
.sun, .sun-vegas { stroke: #f5be3d;
}
.tri-upper, .tri-lower, .tri-bit-left, .tri-bit-right { stroke: #f91f68;
}
.esmes-e-1, .esmes-s-1, .esmes-m, .esmes-e-2, .esmes-s-2 { stroke-width: .18em; stroke: #1ae680;
}
.wave-upper, .wave-lower { stroke: #1ac4e6;
}
.sun-vegas { -webkit-animation-name: vegas; animation-name: vegas; -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: steps(3, end); animation-timing-function: steps(3, end);
}
@-webkit-keyframes vegas { 0% { stroke-dasharray: 0.33, 15.66; stroke-dashoffset: -8; } 100% { stroke-dasharray: 0.33, 15.66; stroke-dashoffset: 8; }
}
@keyframes vegas { 0% { stroke-dasharray: 0.33, 15.66; stroke-dashoffset: -8; } 100% { stroke-dasharray: 0.33, 15.66; stroke-dashoffset: 8; }
}
.esmes-e-1, .esmes-s-1, .esmes-m, .esmes-e-2, .esmes-s-2 { -webkit-animation-name: esmes; animation-name: esmes; -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: steps(2); animation-timing-function: steps(2); -webkit-animation-direction: alternate; animation-direction: alternate;
}
.esmes-e-1 { -webkit-animation-delay: -2s; animation-delay: -2s;
}
.esmes-s-1 { -webkit-animation-delay: -1.6s; animation-delay: -1.6s;
}
.esmes-m { -webkit-animation-delay: -1.2s; animation-delay: -1.2s;
}
.esmes-e-2 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s;
}
.esmes-s-2 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s;
}
@-webkit-keyframes esmes { 25% { opacity: .8; } 75% { opacity: 1; }
}
@keyframes esmes { 25% { opacity: .8; } 75% { opacity: 1; }
}
.wave-upper, .wave-lower { -webkit-animation-name: waves; animation-name: waves; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: steps(1); animation-timing-function: steps(1); -webkit-animation-direction: alternate; animation-direction: alternate;
}
.wave-upper { -webkit-animation-delay: 1.5s; animation-delay: 1.5s;
}
@-webkit-keyframes waves { 0% { opacity: 1; } 67% { opacity: .8; } 100% { opacity: 1; }
}
@keyframes waves { 0% { opacity: 1; } 67% { opacity: .8; } 100% { opacity: 1; }
}

Esmes Vice Anim00ted SVG - Script Codes JS Codes

document.onclick = function() { window.location = "http://esmes.fi";
};
Esmes Vice Anim00ted SVG - Script Codes
Esmes Vice Anim00ted SVG - Script Codes
Home Page Home
Developer Moses Holmström
Username thykka
Uploaded December 15, 2022
Rating 4.5
Size 3,838 Kb
Views 14,168
Do you need developer help for Esmes Vice Anim00ted SVG?

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!

Moses Holmström (thykka) Script Codes
Name
Eclipse
Brainbow Menu
Pagination indicators
Three.js Planetoid
Rotating ASCII Globe
HSL color picker
Pageful Catalogue
Loader - Connect the dots
Rotary control with value display
Flickering ANSI logo
Create amazing video scripts 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!