CSS 그라디언트 만들기
색을 고르면 미리보기와 CSS 코드가 함께 나옵니다.
135도
세 가지 형태
선형은 한 방향으로 곧게 번지고, 원형은 가운데에서 바깥으로 퍼지며, 원뿔형은 중심을 축으로 돌아갑니다. 배경, 버튼, 카드 헤더에 흔히 쓰이는 형태들입니다.
각도 읽는 법
선형 그라디언트에서 0도는 아래에서 위로, 90도는 왼쪽에서 오른쪽으로 향합니다. 대각선 느낌을 원하면 135도 부근이 무난합니다. 원형에는 각도가 적용되지 않습니다.
참고
결과 코드를 그대로 CSS의 background 속성에 넣으면 됩니다. 색을 세 개 쓰면 가운데 색이 중간 지점에 놓입니다. 색상 코드를 다른 형식으로 바꾸려면 색상 변환을 함께 쓰세요.