How to make the font wide?

Question

Design

Hello. I cheated and changed the font width in the layout to make the layout more stylish. Now I need to hand over the project, but I have no idea what the layout designer will do, because I cannot provide him with the required font. Is there any way to change the font width? As I understand it, there is no such property in css and I will have to collect a new font...

Answer 1

One of the contributors suggested a solution: use scale. It might even be a better option than a new font, as the font is oversized, which will negatively impact the site's loading speed.
There is a crutch with margin in his solution, although this could be solved through an anchor point.

transform: scale(1.2,1.0); // изменение ширины
    transform-origin: left; // установление опорной точки

Answer 2

If I were the layout designer, I would insert the layout (jpg) as a background into the container and hand over the work)

Answer 3

If this is one title that does not have a key value, you can insert svg.
If it's all over the site, or if it's the main heading, redo it. You can't make your own font. You will spend half a year on kerning pairs, and the result will still be fig.
And yes - do not touch the letters. Whatever it may seem to you, no one will get better from your “design” of the font. The letters are meant to be read.

Answer 4

Create your font

Answer 5

You can try to play around with the first parameter in scale, like this

h1 {
  transform: scale(1.2, 1.0);
}

Example: https://jsfiddle.net/pjxL5bsq/

Answer 6

This is how it happens, designers cheat and thus create difficulties for workbenches, which are sometimes at a loss how to implement it.

Answer 7

try to create your own non-variant at all?