Вариант с градиентом:
.block {
position: relative;
min-height: 100vh;
outline: 1px dashed red;
overflow: hidden;
background-image: radial-gradient(circle at left,
rgba(6,0,121,1) 0%,
rgba(6,0,121,1) 600px,
rgba(6,0,121,0) 600px);
}
Можно сделать через псевдоэлемент:
.block {
position: relative;
min-height: 100vh;
overflow: hidden;
outline: 1px dashed red;
}
.block::after {
content: '';
width: 150vh;
height: 150vh;
background-color: blue;
border-radius: 100%;
position: absolute;
top: 50%;
left: -50vw;
transform: translateY(-50%);
}
В обоих варантах, желательно знать высоту родительского блока или использовать JS, чтобы ее получить.
