매일 손이 가는 개발자 도구를 한곳에.
변환기, 포맷터, 해시, 검증기, 그리고 계속 다시 열게 되는 작은 유틸리티들이 여러 탭에 흩어지지 않고 한자리에 모여 있습니다.
여러 색상 정지점으로 아름다운 CSS 그라디언트를 만듭니다
CSS 그라디언트는 두 개 이상의 색상 사이를 부드럽게 전환합니다. 배경, 테두리를 비롯한 여러 속성에 사용할 수 있습니다. 그라디언트는 브라우저가 렌더링하며, 픽셀 깨짐 없이 완벽하게 확대·축소됩니다.
그라디언트는 경로를 따라 특정 위치에 색상 정지점(color stop)을 정의하는 방식으로 작동합니다. 선형(linear) 그라디언트는 지정한 각도의 직선을 따라 색상을 전환하고, 방사형(radial) 그라디언트는 중심점에서 바깥쪽으로 색상을 전환합니다…
선형 그라디언트, 방사형 그라디언트, 다중 정지점 그라디언트를 다루어 일반적인 입력과 출력을 빠르게 비교할 수 있습니다.
선택한 도구의 소스 코드로, 오른쪽의 실시간 버전과 함께 여기에 표시됩니다.
// No external dependencies needed - generates CSS gradient strings interface ColorStop { color: string; position: number; // 0-100 } type GradientType = 'linear' | 'radial'; interface GradientOptions {