그라디언트 생성기

두 가지 이상의 색상을 선택하고, 그라디언트를 원하는 대로 드래그한 후 CSS를 복사하세요. 또는 PNG로 다운로드하여 배경화면, 슬라이드 배경, 소셜 포스트 배경으로 사용하세요. 선형, 방사형, 원뿔형 그라디언트를 모두 지원하며, 현대 UI에서 볼 수 있는 부드러운 Apple 스타일 배경을 위한 메시 그라디언트 모드도 제공합니다.

그라디언트 유형 설명

• 선형: 색상 A에서 색상 B로 직선. 방향 선택기(위→아래, 대각선 등).
• 방사형: 동심원 — 중앙의 색상 A가 가장자리로 갈수록 색상 B로 희미해짐. 스포트라이트 효과에 유용.
• 원뿔형: 색상환처럼 중심점 주위를 휩쓸음. 현대 UI 디자인에서 트렌디함.
• 메시 (프리미엄): 여러 색상 블롭이 부드럽게 혼합됨. "Apple 그라디언트" 스타일.

복사할 수 있는 항목

1. CSS: 바로 붙여넣을 수 있는 linear-gradient(...) 또는 background-image: 선언.
2. Tailwind: 가장 가까운 bg-gradient-* 클래스와 사용자 정의 색상 추가.
3. SVG: 아이콘이나 UI 그래픽에서 확장 가능하게 사용.
4. PNG 다운로드: 모든 크기, 휴대폰 배경화면(1284×2778), 데스크탑(3840×2160), 정사각형(1080×1080) 포함.

일반적인 사용 사례

• 휴대폰 배경화면: 메시 그라디언트는 iOS에서 인기가 많습니다. iPhone 배경화면 미리보기를 사용해 테스트해보세요.
• 소셜 포스트 배경: 인용구 그래픽에 즉시 브랜드에 맞는 느낌을 줍니다.
• 히어로 섹션: 그라디언트 배경은 랜딩 페이지에서 흔히 볼 수 있습니다.
• 슬라이드 데크: 지루한 단색 배경을 대체하세요.

잘 어울리는 색상 선택하기

색상환에서 인접한 색상 = 미묘하고 조화로움. 반대쪽 = 대담하고 시선을 사로잡음. 넓은 간격을 연결하려면 중간에 세 번째 중간 지점을 추가하세요. 브랜드에 충실한 그라디언트를 위해 브랜드 HEX를 붙여넣고 두 번째 지점에 틴트 또는 셰이드를 선택하세요. 색상 변환기를 사용하여 틴트(명도가 높은 HSL) 또는 셰이드(명도가 낮은)를 찾으세요.