Как сделать liner gradientom треугольник?

Question

[Александр]

Уже спрашивал у некоторых людей, как делать через линейный градиент треугольник, но я слишком еще слаб в этих градиентах.Получается не совсем то что нужно.
Помогите сделать

его

Мне нужно что б он был фиксированый в одной точке и резиновый при уменьшении. Высота 810, ширина 700. Я сделал через бордер, но это не то немного, так как border-width: 350px 0 350px 700px; все в пикселях, а в %, я так понимаю нельзя делать.

Comments

[Ankhena]

Я же уже отвечала на ваш вопрос
Как сделать background с позиционированием?
Дальше считайте позицию треугольника и размеры.
Если они тянутся на всю ширину окна, то придется вспомнить тригонометрию ;)

[Ankhena]

https://jsfiddle.net/vktoze24/
ну или так, для красоты https://jsfiddle.net/vktoze24/1/
Но это я фантазирую, потому что не знаю о чем думал дизайнер при адаптиве.

[Александр]

Ankhena, да и больше я задавать такое не буду, просто попрактикуюсь в скором времени, а сейчас нужно было срочно)

[Ankhena]

Александр,

только прям очень много материала по ним не вижу

Да там изучать нечего. Угол, цвет и точки перехода из одного цвета в другой.
Остальное на уровне задачек школьной геометрии.

Градиенты теория: https://html5book.ru/css3-gradient/
Паттерны: css.yoksel.ru/css-patterns
Радиальные: css.yoksel.ru/radial-gradients