GilbertAmethyst

https://jsfiddle.net/dugc80mo/1/

div{
position:relative;
width:42px;
height:42px;
}

div::after{
content: "";
display: block;
width: 30px;
height: 4px;
background: red;
transform: rotate(-45deg);
border-radius: 4px;
position:absolute;
left:0px;
bottom:0px;
}

div::before{
content: "";
display: block;
width: 20px;
height: 4px;
background: red;
transform: rotate(45deg);
border-radius: 4px;
position:absolute;
left:-10px;
bottom:-4px
}

Есть способы и разные значения css. Например для размера шрифта (и не только) в зависимости от размера viewport'a (окна браузера) можно использовать vh, например: font-size:100vh; (что значит размер шрифта 100% от размеров окна).

Про другие способы можно почитать тут:
https://css-tricks.com/almanac/properties/f/font-size/

Также можно написать метод на js, который будет менять размеры шрифта в нужном блоке в зависимости от размеров любого элемента на странице и по любому принципу.