본문 바로가기
웹디자인 TOOLS/색상 도구

Chroma 브라우저 색상 툴 웹사이트 컬러 추출하는 방법

by webbus4
반응형

오늘은 Chroma 브라우저 색상 툴을 사용하여 웹사이트 컬러 추출하는 방법에 대해 알아볼게요 

웹디자이너, 개발자 또는 다양한 디자인 분야에서 일하시는 분들에게 웹 어디서든 색상을 추출하고 컬러 팔레트 만들 수 있으니 같이 한번 사용해 보아요!

Chroma 브라우저

1. 브라우저 색상 도구 Chroma

Chroma는 크롬 확장 프로그램으로, 스포이드 및 색상 선택 도구입니다, 

스포이드 색상 선택기, 팔레트 생성기 기능을 포함되어 있고, 모든 웹페이지에서 색상을 추출하고 나만의 색 조합, 컬러 팔레트 만들 수 있어요 

Chroma 브라우저

설치하는 방법은 간단해요 우선 크롬 브라우저 웹스토어에서 'Chroma" 검색하거나 '링크' 통해 추가 설치하면 브라우저 상단에 바로가기 아이콘을 표시됩니다

반응형

2. 크로마(Chroma) 웹사이트 컬러 추출 방법

예시 핀터레스트

색을 추출하고 싶은 웹사이트 또는 웹페이지 방문합니다. 예를 들어 핀터레스트 원하는 일러스트 그림 색상을 추출해 컬러 팔레트 만들어 볼게요

 

예시 핀터레스트 스포이드 활성화

핀터레스트 원하는 일러스트 그림을 찾은 후, 상단 위에 바로가기 크로마 아이콘을 클릭하면, 스포이드 자동적으로 활성화가 되는데요 활성화된 스포이드를 사용하여 핀터레스트 일러스트 그림  색상을 클릭해 줍니다 

그럼 색상을 클릭하면 아래에 색상 팔레트 추가 바가 생성되고, 각 팔레트에는 최대 5가지 컬러를 추가할 수 있어요 '+' 아이콘을 다시 클릭하면 스포이드가 다시 활성화되어 다른 색상을 클릭할 수 있어요 

 

이렇게 웹페이지 그림 색상을 스포이드 통해 5가지 컬러 팔레트를 쉽고 간편하게 만들 수 있어요. 

크로마 색상 팔페트 만들기j

그리고 만든 컬러팔레트 옆에 '↗️' 대각선 화살표 아이콘을 클릭합니다  그럼 내가 만든 컬러 팔레트의 색상 이름부터 색상 코드 정보 볼 수 있고, 색상 편집도 가능합니다 

 

디자이너 일을 하고 있다면 이 브라우저 색상 도구 'Chroma' 꼭 추가해서 사용해 보고 웹 어디서든 원하는 색상 추출하고, 바로 디자인 프로젝트 활용한 가능한 컬러 팔레트 만들어 보세요!

 

 

Chroma

Pick colors from any website and build amazing and shareable color palettes.

chroma.dev

 

 

웹페이지 색 조합 색상 팔레트 바로 보기 툴 Design Sidekick

오늘은 웹디자이너들을 위한 유용한 색상 도구 크롬 확장 프로그램을 소개할게요. 이 프로그램은 웹페이지를 디자인할 때 필요한 색 조합과 팔레트를 쉽게 찾을 수 있게 도와주고, 디자이너들

projectnftbus.tistory.com

반응형

댓글