Wind key, city logo. pure css

Size
2,406 Kb
Views
12,144

How do I make an wind key, city logo. pure css?

Two divs! It is a winder key ... or almost Roberto, from Futurama Saratov (city in Russia) tourist logo, by Art. Lebedev Studio. What is a wind key, city logo. pure css? How do you make a wind key, city logo. pure css? This script and codes were developed by Mikhail Korotkov on 12 November 2022, Saturday.

Wind key, city logo. pure css Previews

Wind key, city logo. pure css - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Wind key, city logo. pure css</title> <meta name="author" content="Mikhail Korotkov">
<meta name="contact" content="[email protected]"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class='logo'> <div class='plank'></div>
</div> <script src="js/index.js"></script>
</body>
</html>

Wind key, city logo. pure css - Script Codes CSS Codes

* {margin:0; padding: 0;}
html {background: rgb(15,63,147);}
.logo { border: 65px solid rgb(234, 79, 95); border-radius: 50%; box-shadow: 0 167px 0 -65px rgb(15, 63, 147), 0 167px 0 0 rgb(234, 79, 95); height: 100px; position: absolute; right: 240px; top: 100px; width: 100px;
}
.logo:before { border-right: 99px solid transparent; border-top: 123px solid rgb(234, 79, 95) ; content: ""; height: 0; left: 133px; position: absolute; top: 174px; width: 0;
}
.logo:after { border-bottom: 118px solid rgb(234, 79, 95) ; border-right: 93px solid transparent; content: ""; height: 0; left: 133px; position: absolute; top: -30px; width: 0;
}
.plank { background: none repeat scroll 0 0 rgb(15, 63, 147); border-bottom: 40px solid rgb(234, 79, 95); border-left: 230px solid rgb(234, 79, 95); border-right: 42px solid rgb(234, 79, 95); content: ""; height: 46px; left: 86px; position: absolute; top: 88px; width: 47px;
}
.plank:after { background: none repeat scroll 0 0 rgb(234, 79, 95); content: ""; height: 56px; left: -344px; position: absolute; top: 21px; width: 157px;
}

Wind key, city logo. pure css - Script Codes JS Codes

//Saratov (city in Russia) tourist logo, by Art. Lebedev Studio
// picture from "Saratov tourist logo usage guide"
//source: http://www.artlebedev.com/everything/saratov/
//It is a winder key ... or almos Roberto, from Futurama
//encountered a bug in box-shadow property: if you delete ".plank:after" (which is just a layer with red background) there is a thin ~1px transparent line around ".plank"
Wind key, city logo. pure css - Script Codes
Wind key, city logo. pure css - Script Codes
Home Page Home
Developer Mikhail Korotkov
Username melawire
Uploaded November 12, 2022
Rating 3
Size 2,406 Kb
Views 12,144
Do you need developer help for Wind key, city logo. pure css?

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!

Mikhail Korotkov (melawire) Script Codes
Create amazing web content 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!