a11y.skipToMainContent
1

색깔 그늘 발전기

모든 헥스 색상을 입력하고 즉시 10 그늘 (50-950)을 Tailwind CSS 스타일로 생성합니다. swatches를 보면서 복사 및 내보내기 구성을 클릭합니다.

Was this tool helpful?
Send Image to:
Advertisement

How to use Color Shades Generator

  1. Hex 색상을 입력하거나 색상 선택기를 사용합니다.
  2. 생성된 10축 스케일을 50~950으로 볼 수 있습니다.
  3. Hex 코드를 복사하거나 전체 설정에 대한 수출 버튼을 사용하십시오.

색상 음영 생성기은 무엇입니까?

Creating 일관된 색깔 가늠자는 디자인 체계를 위해 근본적입니다. 이 도구는 기본 헥스 색상을 가져 와서 풀 세트를 생성합니다. 50 (가벼운)에서 950 (가벼운), 테일 윈드 CSS 색상 스케일 컨벤션을 따르십시오.

각 그늘은 그것의 hex 부호를 가진 색깔 swatch로 표시됩니다. 클립보드에 hex를 복사하려면 swatch를 클릭하십시오. hex 값으로 전체 팔레트를 내보내기, CSS 사용자 정의 속성, 또는 준비-to-use Tailwind CSS 구성 객체.

Advertisement

FAQ

그늘은 어떻게 계산됩니까?
그늘은 흰색 (가벼운 그늘 50-400)과 검은 색 (어둡게 그늘 600-950)과 기본 색상을 혼합하여 계산됩니다.
나는 나의 디자인 체계를 위해 이것을 이용할 수 있습니까?
예 - Tailwind config export는 tailwind로 붙여 넣을 준비가 되어 있습니다. 사용자 정의 브랜드 색상에 대한 config.js.

Related tools

Author

AR
Aisha Rahmani"The Visual Storyteller"

Design Technologist & Media Specialist

Aisha bridges the gap between pixels and code. With expertise in image processing, SVG optimization, and video compression, she helps creators, designers, and marketers prepare media that looks great and loads fast. She has spoken at design conferences about accessible visual content and has helped agencies reduce page-weight budgets by up to 60 percent without sacrificing creative quality.

Advertisement