Coburg Banks SVG Logo
How do I make an coburg banks svg logo?
Working on an animated, SVG version of the Coburg Banks logo.. What is a coburg banks svg logo? How do you make a coburg banks svg logo? This script and codes were developed by Michael on 14 October 2022, Friday.
Coburg Banks SVG Logo - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Coburg Banks SVG Logo</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <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> <div class="container"> <svg class="branding" xmlns="http://www.w3.org/2000/svg" width="201" height="226" viewBox="0 0 201 226" version="1.1"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g fill="#000000"><path class="branding__one" d="M91.7 222.1C92.3 222.1 93 222 93.6 222 115.5 221.9 134.6 214.3 150.7 199.6 160.9 190.4 168 179.1 172.4 166.1 176.1 155.3 177.3 144.2 176.2 133 174.9 119.2 170.2 106.6 162.3 95.2 152.3 81.1 139.3 71 123.1 64.8 115 61.6 106.5 59.8 97.7 59.7 95.2 59.6 95.1 59.6 95.2 57 95.4 42.1 95.6 27.2 95.9 12.3 95.9 11.7 96 11.1 96 10.4 96.1 7.4 96.1 7.3 99.1 8.1 104.2 9.5 109.2 10.8 114.3 12.1 115.6 12.5 116.1 12.9 115.9 14.5 115.2 23.1 114.7 31.7 114.1 40.3 113.8 45.4 113.4 50.5 112.9 55.6 112.8 57.1 113.1 57.6 114.7 57.6 139.1 58.1 160.1 66.9 177.1 84.5 187.8 95.5 195.1 108.6 198.3 123.8 204.6 154.6 196 180.9 173.3 202.6 161.5 213.9 147.2 220.7 131.3 224 118.9 226.4 106.5 226.1 94.2 223.3 93.3 223.1 92.5 222.8 91.6 222.5 91.7 222.4 91.7 222.2 91.7 222.1L91.7 222.1Z"/><path class="branding__two" d="M123.6 201C118.7 202.9 113.8 205.1 108.9 206.8 100.7 209.6 92.2 211 83.5 211.3 76 211.6 68.6 211.1 61.3 209.5 44.3 205.6 29.5 197.6 17.9 184.4 10 175.4 4.4 165.1 2.1 153.3 1.2 148.6 0.2 143.8 0.1 139.1 0 127.9 2.2 117.2 6.9 107.1 15.5 88.7 29 75.3 47.1 66.3 54.6 62.6 62.3 59.8 70.6 58.4 71.1 58.3 71.6 58 72 57.9 72.4 57.8 72.9 57.8 72.8 57.8 68.3 60.3 63.2 62.8 58.5 65.8 43.9 75.3 32.9 88 26.6 104.3 24.6 109.6 23.1 115.1 22.1 120.6 21.1 126.3 21.1 132.1 21.7 137.9 22.9 149.6 26.9 160.2 33.4 169.8 40 179.8 48.9 187.4 59.3 193.2 66.6 197.2 74.3 200.1 82.4 201.7 91.8 203.6 101.3 204 110.8 202.7 115 202.1 119.2 201.4 123.4 200.7 123.4 200.8 123.5 200.9 123.6 201L123.6 201Z"/><path class="branding__three" d="M134.9 48.5C140.5 39 146 29.8 151.4 20.6 151.3 20.4 151.1 20.3 151 20.1 150 20.4 148.9 20.7 147.9 21.2 144.2 22.9 141.3 25.8 139 29 136 33.2 133.2 37.5 130.2 42.1 129.4 39 128.5 36 128.1 33 127.4 26.9 127.9 20.9 131.2 15.4 134.5 9.9 139.5 6.6 145.4 4.3 151.9 1.8 158.8 0.9 165.7 0.6 170.2 0.4 174.6 0.4 179 0.6 182.5 0.7 182.4 0.9 181.8 4.4 180.6 10.7 178.8 16.9 176.2 22.8 172.2 32 167.2 40.5 158.1 45.8 152.6 49 146.7 49.9 140.4 49.3 138.7 49.1 137 48.8 134.9 48.5L134.9 48.5Z"/></g></g></svg>
</div>
</body>
</html>
Coburg Banks SVG Logo - Script Codes CSS Codes
html, body { height: 100%;
}
.container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; min-height: 100%; background-color: #351456;
}
@-webkit-keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 5% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 10% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 20% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } 25% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
@keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 5% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 10% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 20% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } 25% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
@-webkit-keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 10% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 15% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 25% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 40% { -webkit-transform: none; transform: none; } to { -webkit-transform: none; transform: none; }
}
@keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 10% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 15% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 25% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 40% { -webkit-transform: none; transform: none; } to { -webkit-transform: none; transform: none; }
}
@-webkit-keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 45% { opacity: 1; -webkit-transform: none; transform: none; } to { opacity: 1; -webkit-transform: none; transform: none; }
}
@keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 45% { opacity: 1; -webkit-transform: none; transform: none; } to { opacity: 1; -webkit-transform: none; transform: none; }
}
.fadeInDown, .branding__three { -webkit-animation-name: fadeInDown; animation-name: fadeInDown;
}
.bounceInUp, .branding__two { -webkit-animation-name: bounceInUp; animation-name: bounceInUp;
}
.bounceInRight, .branding__one { -webkit-animation-name: bounceInRight; animation-name: bounceInRight;
}
.animate, .branding__one, .branding__two, .branding__three { -webkit-animation-duration: 10s; animation-duration: 10s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-delay: 2s; animation-delay: 2s;
}
.branding { -webkit-box-flex: 1; -ms-flex: 1; flex: 1;
}
.branding__one { fill: #ffffff;
}
.branding__two { fill: #a9b012;
}
.branding__three { fill: #a9b012;
}

Developer | Michael |
Username | mjtweaver |
Uploaded | October 14, 2022 |
Rating | 3 |
Size | 3,875 Kb |
Views | 10,115 |
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!
Name | Size |
A Pen by Michael | 1,914 Kb |
Building an Accordion without JavaScript - Part II | 3,800 Kb |
Product Magnification without JavaScript | 2,627 Kb |
SVG Logo | 4,523 Kb |
Slick Slider - Progress Bar | 2,992 Kb |
Masonry debugging | 21,323 Kb |
Building an Accordion without JavaScript - Part I | 1,596 Kb |
Using Level 4 CSS Validity Pseudo-Classes to Improve Form UX. | 2,710 Kb |
Filtering | 2,444 Kb |
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!
Name | Username | Size |
Flex layout example | Mofny | 1,663 Kb |
Marching Squares Visualized | Sakri | 7,074 Kb |
Flat iOS 7 Safari Icon | Rss | 3,332 Kb |
BSP Dungeon Generation | Xgundam05 | 5,326 Kb |
Materializecss input form | Jasonchan | 1,443 Kb |
Shop Talk logo made in CSS | Hugo | 19,368 Kb |
Day 11 - Calendar Card | Arnellebalane | 6,984 Kb |
Bezier Animation with straight paths | Rhernando | 2,087 Kb |
Falling Down the Rabbit Hole | Rachelnabors | 4,578 Kb |
Simple personal profile | Miroot | 2,856 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!