
It is a slightly modified version of it to. You can check out the result in this CodePen. The new, redesigned Spotify logo is more graphic and inspired by a sans-serif typeface called The Gotham Medium. A slightly alternative but interesting Spotify logo made with CSS. We can leverage the aspect-ratio and a border radius of 50% to make it fully round.spotify Īnd that's it. I'll be using one container div, which will hold the rounded button, then three divs inside for each line. Making the Spotify logo in CSS įirst, let's start with the HTML we are going to need.

So my approach will be to use rounded ellipses, only color the top border, then use pseudo-elements we can add the round ends to it.Īlright, let's do this thing. The closest we could get would be to do a square and add a border radius, but in that case, we would not be able to curve it. These rounded lines seem simple at first, but thinking about it, we don't have a "line" in CSS, nor can we apply rounded corners to these kinds of bent lines. We first see that the logo has a big rounded button in the background and three rounded lines. Note: The above image is the current logo Analysing the logo I won't be making a pixel-perfect representation because I like this older app icon.

In this article, we'll be recreating the Spotify logo. If you are interested in enhancing your business brand, fill out my? Logo Worksheet?today.My own twist to the Spotify logo made completly with CSS 24 Mar, 2022 Now with their new simplfied identity, it has appealed to me and will be looking to download the app again to try it out.īasic logo and identity design prices start from just ?500.

And their new?promo video, which incorporates the new logo at the end follow suit. The? new Spotify website?is also simplified and looks well designed around their new brand logo style. Looking closely at the logo icon, the subtle shadows within the three wave?curves lifts the logo a little. The new logo has got rid of those huge serifs and bouncy ‘o’ and based the lettering on a professional font – (‘Avenir’ I think?). Maybe I was not their ‘typical’ younger audience that the old logo seemed to convey with it’s bouncy castle lettering – but it stopped me downloading the app.

Similar to what? Microsoft?and? ITV?in the UK have done, Spotify has followed and I think it’s a step in the right direction.įirst impressions last so when I first came across Spotify a couple of year ago the logo put me off. There has been a trend lately for companies to simplify their logos and Spotify is one such well-known company who has recently updated their logomark and now appeal to a wider audience. Spotify’s new logo does all this – and quite elegantly. A logo mark that scales from a small mobile screen to a large advertising billboard and still be clearly recognised and it’s message communicated. Not? dumbed-down?simple, but? ‘elegantly’?simple. I have always as a logo designer followed my first basic rule when looking at logo design -? Keep It Simple.
