브라우저에서 처리됩니다
추천 도구AI Coding Assistant
GitHub Copilot
AI pair programmer that helps you write code faster with smart suggestions.
개요 CSS 그라디언트 생성기?
CSS 그라데이션 생성기는 선형, 원형, 원뿔형 그라데이션을 시각적 에디터로 만들고 바로 사용 가능한 CSS 코드를 출력합니다. 직접 문법을 작성하는 수고를 덜어주고, 색상, 각도, 정지점을 인터랙티브하게 실험할 수 있습니다.
사용 방법
- 그라데이션 유형(선형, 원형, 원뿔형)을 선택하세요
- 그라데이션 바를 클릭하여 색상 정지점을 추가하고 위치를 조절하세요
- 그라데이션의 각도나 방향을 조절하세요
- 생성된 CSS 코드를 복사하여 스타일시트에 붙여넣으세요
공식
linear-gradient(direction, color1, color2, ...)
자주 묻는 질문
- 선형과 원형 그라데이션의 차이는?
- 선형(linear)은 직선 방향으로, 원형(radial)은 중심에서 바깥으로 퍼지는 그라데이션입니다.
- 3가지 이상 색상도 가능한가요?
- 네, 원하는 만큼 색상 정지점을 추가할 수 있습니다. 각 색상의 위치를 백분율로 지정할 수 있습니다.
- 그라데이션이 모든 브라우저에서 작동하나요?
- 최신 브라우저에서 모두 지원됩니다. IE 9 이하에서는 fallback 배경색을 함께 지정하는 것이 좋습니다.