New logo design (…but it still seems stupid!)

[Steven Watson]

Perhaps your business card could be something like:

Wow, that looks pretty cool man!

You’re talking about the serif and you could always use lowercase characters.

Lowercase looks damn good IMO, I really like the serif on the ‘n’

[__]

I like “STVN” in the circle (also totally do-able in CSS).

I think I’d like the triangle idea too if it were aligned on the baseline.

[chrisburton]

Lowercase looks damn good IMO, I really like the serif on the ‘n’

I love everything about Shift. You should make some capitalized and lowercase options. This way we can see side by side.

Shift can be used for 30 days free. I’d sign up, grab the css font file and create live examples.

[nixnerd]

I like “STVN” in the circle (also totally do-able in CSS).

TRUE! You could have a badass little SVG animation if you ever needed it too! This would more be for loading meter or something but it would be sweet. STVN and the circle could complete around it. Snap.svg would be great for this logo.

[Steven Watson]

Shift can be used for 30 days free. I’d sign up, grab the css font file and create live examples.

Thanks, @chrisburton, what style is that Shift font you posted as there are numerous types, such as Shift Book, Shift Medium, Shift Light etc…

[Steven Watson]

I like “STVN” in the circle (also totally do-able in CSS).

I think I’d like the triangle idea too if it were aligned on the baseline.

Yep, I’ll do as Chris mentioned, download the CSS file and play around with some live examples :)

TRUE! You could have a badass little SVG animation if you ever needed it too! This would more be for loading meter or something but it would be sweet. STVN and the circle could complete around it. Snap.svg would be great for this logo.

Yep, that would look SWEET indeed!

[chrisburton]

Shift Book, I believe. You can add their whole library for 30 days. There’s no max so try a few weights out.

[chrisburton]

@watson90 Make sure you also add your domain in the settings or the CSS file will just 404. Use the chat in the sidebar on here if you’re having trouble.

[Steven Watson]

I did do that @chrisburton but for some reason it needed adding in again, not sure why, the styles are working correctly now. Thanks :)

[chrisburton]

You should add the following to whatever element or class you have set to enable kerning.

-webkit-font-feature-settings: "kern";
-moz-font-feature-settings: "kern";
-o-font-feature-settings: "kern";
font-feature-settings: "kern";

[Steven Watson]

Thanks Chris, I am trying to make my circular logos with CSS, but I am unsure as to how I would set border-radius without having to set a width and height attribute to the actual logo, I thought there was a more universal way but I think I would need to make a different class for each logo as the circle for STVN is alot smaller than for STEVEN.

http://stevenwatson.co.uk/wp/

The capital letters using Shift are growing on me now, I am beginning to like the look of them.

[chrisburton]

It’s actually quite simple. You need to restructure your HTML, though.

http://codepen.io/chrisburton/pen/bAHKk

[chrisburton]

@watson90 I had read your post wrong. My apologies.

Why would you not want to specify a width and height?

[nixnerd]

Why would you not want to specify a width and height?

Because I’m guessing he think he’d have to use an absolute value and he wants to maintain aspect ratios.

OP, You can set width and height in a relative value like vw. Then, you can set a border-radius either in percentages or vw as well.

[Steven Watson]

Why would you not want to specify a width and height?

No idea, I just assumed that applying padding to the li that it could automatically fit around the ‘STVN’. Nevermind, man…

[Author]

Posts