CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Jitendra Vyas
Jitendra Vyas

Reputation: 152855

How to increase the angle of italic text?

I want to make a logo using html css. Can we increase the angle of italic text using css or javascript?

Upvotes: 2

Views: 9386

Answers (8)

bastiensarolea
bastiensarolea

Reputation: 41

font-style: oblique 20deg;

Use whatever you want instead 20. Usefull to decrease the italic angle aswell. (edit : works only on Firefox and Thunderbird, thx to MrLister)

Upvotes: 0

Parva Patel
Parva Patel

Reputation: 21

Try using the skew transform property of CSS instead of using italics. It may help you.

For e.g.: 

<div style="transform: skewX(-10deg)">Sample italic text</div>

P.S.: This method will help you change the angle of italics of text, but for the case of designing the logo, you'll definitely need illustrator for excellence.

Upvotes: 2

dev101
dev101

Reputation: 1369

This page comes up at the top in search engines, and yet no real answer is provided. Yes, today this is possible with pure CSS3 using skew - check this answer here: https://stackoverflow.com/a/7999132

However, instead of positive 30deg values from above answer, to simulate fine italic angle you need to use negative degree values (-5deg for example).

Works & looks great in all modern browsers which support skew. You can combine regular italic style with skew to achieve even better rendering (worked in my case).

Upvotes: 3

Eli Grey
Eli Grey

Reputation: 35903

Make your own font or modify an open source font using a free font-editing tool such as FontForge.

Edit: I see that this is for e-mail with images disabled. Sorry, but it's not possible at all in this case, as most e-mail clients other than new versions of Thunderbird don't support @font-face CSS rules.

Upvotes: 0

BalusC
BalusC

Reputation: 1109570

HTML/CSS is the wrong tool for this. Use Illustrator or that kind of software. Or look for a designer.

Upvotes: 0

Azeem.Butt
Azeem.Butt

Reputation: 5861

You can use a skew transform in Firefox, Safari and Chrome. Nothing else is going to support it, and you shouldn't screw around with a font designer's work for a logo design unless you know more about typography than they did anyway. Nobody designs logos in HTML and nobody wants to look at logos in email.

Upvotes: 1

Luk&#225;š Lalinsk&#253;
Luk&#225;š Lalinsk&#253;

Reputation: 41316

The angle depends on the font you are using. The font designer has to draw the italic version manually. You can't change that automatically.

Upvotes: 7

Tatu Ulmanen
Tatu Ulmanen

Reputation: 124878

That's not possible with CSS. You could try to switch to another font on i's and em's that has more slanted letters but I don't think that'll help you.

And if you're designing a logo, why are you doing it with CSS? That's what you have Photoshop and/or Illustrator for.

Upvotes: 0

Related Questions