deniskins23, SVG и JS вам в помощь. Если вы занимаетесь front'ом, то вам SVG тоже в определенной степени нужно знать. Либо попросите дизайнера прислать SVG-вариант, а уже сами оптимизируйте его структуру внутри, чтобы управлять ей потом с помощью JS.
deniskins23, ну тогда я вариантов не вижу. Только SVG и JS, который будет контролировать размеры отдельных групп элементов внутри. Если проще — то это несколько слоев (первый слой темно-синей подложки, второй слой с уголками и третий слой с паттерном границ и шриховки) + clip-path. И то останется вопрос с несколькими уголками, где линии пересекаются не под прямым углом.
Иначе надо было дизайнеру думать раньше, ведь он понимает, что браузер не будет перерисовывать его растр, чтобы подогнать под размеры? Ведь, наверное, дизайнер знает, как работает инструмент transform в PS и что из этого выходит?
deniskins23, ну, чтобы помочь, то нужно понимать, как и куда все это двигается/тянется при адаптивности, вы это укажите в вопросе, иначе никто не сможет вам помочь. В данном случае можно и растр ваш туда поместить, только, как я понял теперь, там есть штриховка внутри -- и вот она будет растягиваться так себе. Но! С учетом ее размером, то тут можно внутри просто закрасить полностью эту область полупрозрачным белым, никто эту штриховку при маленьком размере не видит и так.
Как видите, данный подход приводит к искажению в зоне треугольного выреза, ибо он подходит только если идет изменение только по высоте в данном случае. Кстати, можно сделать сборную солянку из 3 частей, которые будут совмещены: слева не тянется фикс, по середине тянущийся паттерн, а и справа — снова фикс этой треуголки. Словом, мне лень это делать. Может, кто-то и сделает это.
Не знаю, можно ли в данном случае так настроить SVG, чтобы он визуально правильно тянулся только из одного файла без JS.
Самое хорошее — иметь backend-коллегу, который без классического раздражения backend'ера на «картинки дизайна» сможет дать консультацию о том, что реализовать сложно, что реализовать можно и какие будут издержки.
А так — лучше, конечно, понимать всё в этом мире, но это невозможно, поэтому лучше развивайтесь в дизайне, там тоже много времени и труда нужно. В противном случае у вас его не будет хватать ни на что — и толковым специалистом вы не станете.
И ещё изучите box-sizing: border-box. И посмотрите пример, что я кидал вам два вопроса назад в комментариях, на который вы даже не ответили: Как задать расстояние между элементами css?
