css

CSS - linear-gradient 두 개 써서 각각 다른 그라데이션 주기

개발따라김양 2024. 4. 24. 16:17

1. 목표

왼쪽에서부터 절반정도는 단일 색상 그 이후로는 위에서 아래로 내려오는 그라데이션이 들어가야 했음.

 

2. 코드

linear-gradient를 두 개 쓰고 남은 부분에 투명색인 transparent를 주어서 해결!!

	background: linear-gradient(124deg, #D9E1FD 48%, transparent 48%),
				linear-gradient(180deg, #B411A7 0%, #5C0378 100%)