Menu
Anyone have any idea to how to calculate photoshop letter spacing in css px or rem. Example: I have 140 letter spacing in photoshop. Now, what should be this on CSS? Or is there any way to do this with sass?
832
Photoshop to Letter Spacing CSS Converterfunction cal() { let input = parseInt( $( '#tracking-value' ). val() ); if ( $( '#em' ).is( ':checked' ) ) { $( '#the-value' ). html( (input / 1000) + 'em;' ); $( '.
Using font-relative values (em or rem) is recommended, so that the letter-spacing will increase or decrease by an appropriate amount if the font-size is changed. The length value is added to (or subtracted from) the browsers default spacing (which is based on the font metrics.)
Dividing the value in Photoshop by 1000 and setting that result in em gives pixel-perfect results.
For example, let's say in Photoshop you have a letter spacing of 50, the resulting css would be letter-spacing: 0.05em.
Create a simple function to help you do the math everytime:
@function letter-spacing($ps-value) {
@return ($ps-value / 1000) * 1em
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
