Выше вы можете увидеть, что я должен получить в результате:
width: 224px;
height: 36px;
border-radius: 50px;
border-style: solid;
border-width: 1px;
border-image-source: linear-gradient(to left, #7c7c7c, #e1e1e1 51%, #7c7c7c);
border-image-slice: 1;
background-image: linear-gradient(99deg, rgba(71, 71, 71, 0.4) 2%, #2e2e2e), linear-gradient(to left, #7c7c7c, #e1e1e1 51%, #7c7c7c);
background-origin: border-box;
background-clip: content-box, border-box;
здесь вы можете увидеть стили для кнопки
text-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
background-image: linear-gradient(to bottom, var(--white) 40%, #a5a5a5 58%, #8e8e8e 64%);
font-family: Montserrat;
font-size: 12px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.33;
letter-spacing: 1px;
text-align: center;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
здесь вы можете увидеть стили для текста
вот мой результат
https://jsfiddle.net/cezLu5fg/
здесь вы можете увидеть мой код в скрипке. Я не очень понимаю, что не так Что я делаю не так? И как это обнаружить? Я думал, что у нас есть zeplin для этих целей, которые дают правильные стили, которые мы можем применять для наших css элементов, но это работает так, как вы можете видеть. Если вам нужна дополнительная информация, пожалуйста, дайте мне знать!