<div class="container">
<div class="fig"></div>
</div>
.container {
position: relative;
border: 1px solid #000;
width: 800px;
height: 400px;
overflow: hidden;
}
.fig {
position: absolute;
top: 0;
left: -105%;
width: 150%;
height: 150%;
transform: skew(-20deg, -25deg);
background: linear-gradient(180deg, #C91C04 0%, #4B0900 100%);
}
...когда изучал данную тему толком ничего не было на русском языке...- брехня, есть на русском перевод официала бутстрап обеих версий. Uikit по аналогии освоить не долго, дело вкуса. Главное что нужно сделать - прочитать руководство внимательно, оно исчерпывающее, а не строчить на тостер по любому поводу.