–

메인 컬러와 잘 어울리는 색을 찾는 건 여전히 어려운 일이에요. (특히 제게는!) 모바일 환경에서는 제한이 더 많을 수 밖에 없어요. 피그마 등을 활용해 만든 화면에 컬러를 하나씩 변경하며 확인하는 것도 마찬가지! 그래서 오늘은 이런 어려움을 상대적으로, 조금이나마 줄여줄 수 있는 컬러 조합 서비스를 살펴보고자 합니다.

  • Backgrounds, main elements
  • For 2nd level elements, text
  • For CTAs and accent touches

메인 컬러를 포함, 함께 활용할 수 있는 2가지 컬러를 목업 내 확인할 수 있는 서비스 ‘Mobile Palette Generator’ 입니다.

–

서비스 구성은 아주 간단하며, 사용자 입장에서 어렵지 않게 활용할 수 있어요. 우리가 해야 할 일은 ‘메인 컬러’를 하나 지정하는 것입니다.

왼쪽 위에서 선택한 ‘메인 컬러’에 따라 오른쪽으로 3가지 컬러 조합을 확인할 수 있어요. 간단한 모바일 화면 속 배경으로 쓰이는 메인 컬러와 텍스트, CTA(버튼) 등에 적용된, 함께 활용하기 좋은 컬러를 볼 수 있습니다.

최초 설정한 메인 컬러를 바탕으로 색을 추천해주는 개념이라 2,3번째 컬러를 직접 변경하는 건 어려워요. 하지만 밝기 등을 조절해 비교해볼 순 있습니다. (위 이미지 속 화살표는 각각의 컬러가 어디에 적용되는 지 쉽게 확인할 수 있도록 적용해봤어요.)

화면에 적용된 세 가지 컬러값은 클릭 한 번으로 복사해 활용할 수 있습니다. 한 가지 컬러를 설정하면 함께 쓸 수 있는 컬러 정보를 알려주며, 기본 화면 구성 시 어떻게 적용되는지 미리 확인 할 수 있다는 점에서 유용하게 활용 할 수 있을 것 같네요! 컬러 조합에 대한 자세한 내용은 ‘이 곳’을 통해 확인해주세요!

–

함께 활용해보세요!

–

Post Views: 66

RELATED ARTICLESMORE FROM AUTHOR