PDF download PDF 다운로드 PDF download PDF 다운로드

HTML 과 CSS 에서는 색상을 16진법 코드로 인식한다. 웹페이지를 만들거나 HTML 프로젝트를 만들 때 이미지, 웹사이트, 컴퓨터 화면 창에 있는 특정한 색상을 포함하고 싶다면, 해당 색상의 16진법 코드를 알아야 한다. 이 글은 색상의 16진법 코드를 빠르게 알아내는 여러가지 무료 도구를 사용하는 방법에 대해 소개한다.

방법 1
방법 1 의 4:

맥에서 디지털 컬러 측정기 사용하기

PDF download PDF 다운로드
  1. 이 도구는 맥OS에 깔려있는데 화면에 있는 색상값을 알아낼 수 있다. [1] 파인더를 열고 애플리케이션 폴더를 더블클릭한 후, 유틸리티 폴더를 더블클릭하고, 디지털 컬러 측정기 를 더블클릭하여 연다.
  2. 마우스를 움직일 때 도구에 있는 값이 실시간으로 업데이트 될 것이다. 수평선, 수직선 모양의 도구가 잠겨질 때까지 해당 위치에서 마우스를 움직이지 않는다.
    • 이 도구를 사용해서 웹에 있는 색상 또한 알아낼 수 있다. 사파리(또는 원하는 브라우저)를 열어서 알아내고자 하는 색상이 들어간 웹사이트로 이동한다. .
  3. 을 누른다. 그러면 수평선 수직선 모양의 도구가 잠기는데, 그러면 마우스가 움직일 때 색상값이 바뀌지 않는다.
  4. 를 눌러서 클립보드에 16진법 코드를 복사한다. 색상 메뉴를 클릭하고 텍스트로 색상 복사 를 선택하면 된다.
  5. 를 눌러 복사된 코드를 붙여넣기 한다. HTML 코드, 텍스트 파일 또는 입력하는 다른 부분에 바로 붙여넣기할 수 있다.
  6. 을 눌러서 잠금을 해제한다. 다른 색상을 알아내고 싶다면, 잠금을 풀고 커서를 다시 색상 값 식별도구로 사용한다.
    광고
방법 2
방법 2 의 4:

Windows 에서 Color Cop 사용하기

PDF download PDF 다운로드
  1. Color Cop 은 가벼운 무료 유틸리티로, 화면에 어떤 색상이든 해당 색상의 16진법 코드를 빠르게 알아낼 수 있는 도구다. 다음과 같이 앱을 받으면 된다.
    • 웹 브라우저에서 http://colorcop.net/download 로 이동한다.
    • "self-installing." 아래의 colorcop-setup.exe 를 누른다. 파일이 자동으로 다운로드되지 않으면 Save 또는 OK 를 눌러 다운로드를 시작한다.
    • 다운로드된 파일을 더블 클릭한다. ( 다운로드 폴더에서 찾을 수 있고, 보통 브라우저 탭 왼쪽 하단 코너에 있다).
    • 화면의 순서를 따라 앱을 설치한다.
  2. 시작 메뉴에서 찾을 수 있다.
  3. 다른 애플리케이션이나 웹 사이트를 포함한, 화면에 있는 어느 색상이나 알아낼 수 있다.
  4. 애플리케이션 중간의 빈칸에 코드가 보일 것이다.
  5. 그러면 16진법 코드가 클립보드에 복사된다.
  6. Ctrl + V 를 눌러서 HTML 또는 CSS 코드와 같이 원하는 곳에 붙여넣기한다.
    광고
방법 3
방법 3 의 4:

Imagecolorpicker.com 사용하기

PDF download PDF 다운로드
  1. 컴퓨터, 핸드폰, 태블릿에서 https://imagecolorpicker.com 으로 이동한다. 이 무료 도구를 사용하면 업로드된 이미지에 있는 색상의 16진법 코드를 알아낼 수 있다. 이 방법은 안드로이드, 아이폰, 아이패드를 포함한 어느 웹 브라우저에서나 사용할 수 있다.
  2. 자신의 이미지를 업로드할지, 온라인에 있는 이미지를 업로드할지 정해야 한다. 둘 중에 한 가지 방법을 사용하여 사진이나 웹페이지를 표시하여 원하는 색상을 선택하면 된다.
    • 이미지를 업로드하려면 아래로 스크롤하고 Upload your image 를 누른 뒤, 컴퓨터, 핸드폰, 태블릿에 있는 이미지로 이동하고 옵션을 선택하여 업로드하면 된다.
    • 웹사이트를 사용하려면 아래로 스크롤하여 "Use this box to get the HTML color code from a website" 옵션으로 이동하고, URL을 입력한 뒤에 Take website 를 클릭하면 된다.
    • 전체 웹사이트 대신, 이미지를 바로 선택하고 싶다면, "Use this box to get the HTML color code from a picture via this URL" 박스에 이미지 URL을 입력하고 Take image 를 클릭하거나 탭하면 된다.
  3. 그러면 화면 왼쪽 하단 코너에 있는 16진법 색상 코드가 뜬다.
  4. 16진법 코드 오른쪽에 겹쳐져 있는 2개의 네모를 찾으면 된다. 그리고 텍스트 파일이나 텍스트를 입력하는 곳에 붙여넣기 하면 된다.
    광고
방법 4
방법 4 의 4:

Firefox (웹에 있는 색상을 찾을 때 ) 사용하기

PDF download PDF 다운로드
  1. 파이어폭스 웹 브라우저에는 무료 점적기 도구가 있어서, 이를 사용하면 웹에 있는 색상의 16진법 코드를 알아낼 수 있다. 파이어폭스가 있다면, 시작 메뉴(윈도우) 또는 애플리케이션 폴더(macOS)에서 찾을 수 있다.
    • https://www.mozilla.org/en-US/firefox 에서 무료로 파이어폭스를 다운로드할 수 있다.
    • 파이어폭스는 웹사이트에 있는 색상값을 알려준다. 브라우저 밖에서는 사용할 수 없다.
  2. 해당 색상이 브라우저 뷰 안에 있어야 한다.
  3. 파이어폭스 오른쪽 상단 코너에 있는 3개의 수평선 버튼이다.
  4. 메뉴를 클릭한다. 다른 메뉴가 확장될 것이다.
  5. 를 클릭한다. 마우스 커서가 큰 원으로 변할 것이다.
  6. 마우스를 해당 위치에 움직일 때 색상값이 실시간으로 업데이트되는 것이 보일 것이다. 마우스를 클릭하고 나면 파이어폭스가 클립보드에 16진법 코드를 저장할 것이다.
  7. Control + V (PC) 또는 Command + V (Mac) 를 사용하여 HTML, CSS 또는 원하는 텍스트 파일에 16진법 코드를 붙여넣기 한다.
    광고

  • 컬러 픽커를 사용하여 색조 코드를 보여주는 웹사이트나 브라우저 확장도구, 이미지 편집 프로그램도 많이 있다.
  • 알아내고자 하는 색상으로 웹 페이지를 만든 사람을 안다면, 당사자에게 물어볼 수도 있다 아니면 웹사이트 소스 코드 를 확인하여 나와있는 16진법 코드를 찾을 수도 있다.
광고

이 위키하우에 대하여

이 문서는 5,310 번 조회 되었습니다.

이 글이 도움이 되었나요?

광고