Coburg Banks SVG Logo

Developer
Michael
Size
3,875 Kb
Views
10,120
  1. Coburg Banks SVG Logo Previews
  2. Coburg Banks SVG Logo HTML Codes
  3. Coburg Banks SVG Logo CSS Codes

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 Previews
IQ Test

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;
}
Coburg Banks SVG Logo - Script Codes
Coburg Banks SVG Logo - Script Codes
Home Page Home
Developer Michael
Username mjtweaver
Uploaded October 14, 2022
Rating 3
Size 3,875 Kb
Views 10,120
Do you need developer help for Coburg Banks SVG Logo?

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!

Michael (mjtweaver) Script Codes
Name
Product Magnification without JavaScript
Building an Accordion without JavaScript - Part II
A Pen by Michael
Building an Accordion without JavaScript - Part I
Masonry debugging
Slick Slider - Progress Bar
Filtering
SVG Logo
Using Level 4 CSS Validity Pseudo-Classes to Improve Form UX.
Create amazing blog posts 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!