본문으로 건너뛰기
Toolars
둘러보기
버그 신고

디자인 · 로컬 유틸리티

RGBA → HEX 변환

RGBA to HEX Converter

rgb(), rgba() 색상을 채널별 확인과 정확한 알파 반올림으로 #RRGGBB 또는 #RRGGBBAA로 로컬에서 변환합니다.

작업 경로 / 입력에서 결과까지

채널 값 입력하기

로컬에서 실행 · 업로드 없음

RGBA → HEX 변환 사용법, 개인정보 보호 및 관련 도구

작업 경로 / 입력에서 결과까지

RGBA 색상을 HEX로 변환하는 방법

  1. 01

    채널 값 입력하기

    「RGB 또는 RGBA 색상」 필드에 rgb() 또는 rgba() 값을 입력하세요. 처음에는 rgba(109, 94, 248, 0.8)이 채워진 상태로 열리고 최대 64자까지 입력할 수 있습니다. 빨강, 초록, 파랑은 0~255의 정수, 알파는 0~1의 숫자입니다. 백분율과 범위를 벗어난 채널은 거부됩니다.

  2. 02

    변환 실행하기

    「HEX로 변환」을 누르세요. 파서는 변환 전에 모든 채널을 검증하고, 필드를 수정하는 즉시 이전 결과가 지워져서 패널에 오래된 값이 표시되지 않습니다.

  3. 03

    16진수 결과 확인하기

    결과는 대문자 16진수 값입니다. 완전 불투명이면 #RRGGBB, 알파가 1 미만이면 #RRGGBBAA가 됩니다. 알파 바이트는 알파에 255를 곱해 반올림한 값이라서, 0.8은 204가 되고 CC로 표기됩니다.

  4. 04

    개별 채널 검토하기

    결과 채널과 미리보기는 알파를 8비트로 양자화한 HEX 출력 색상입니다. 예를 들어 알파 0.65는 166/255가 되어 0.65098로 표시됩니다. 입력 알파가 아닌 출력 결과를 보여 줍니다.

  5. 05

    샘플 변환 불러오기

    「샘플 불러오기」를 누륩면 전체 실행을 볼 수 있습니다. rgba(14, 165, 233, 0.65)는 #0EA5E9A6으로 변환됩니다. 0.65에 255를 곱하면 166으로 반올림되고, 16진수로 A6이기 때문입니다. 「초기화」는 기본 입력 rgba(109, 94, 248, 0.8)로 되돌려요.

  6. 06

    결과 복사 또는 다운로드하기

    「출력 복사」를 눌러 16진수 값을 복사하거나, 「다운로드」를 눌러 toolars-color-hex.txt로 저장하세요. 둘 다 변환이 성공하기 전에는 비활성 상태입니다.

도구 요약

처리
브라우저에서 완결
입력의 기기 외 전송
없음
저장
아무것도 저장하지 않음
가격
무료

입력 값은 브라우저에 머물러요.

RGBA → HEX 변환 도구는 검증된 로컬 실행 경로를 사용하고, 숨겨진 입력 또는 출력 기록을 만들지 않습니다.

로컬 실행

현재 브라우저 탭 안에서 실행됩니다.

숨겨진 처리 없음

사용 중인 도구 데이터는 Toolars 문서 기록으로 남지 않습니다.

계정 불필요

프로필을 만들지 않고도 핵심 워크플로를 사용할 수 있습니다. 즐겨찾기는 로그인 후 계정에 동기화됩니다.

즉시 초기화

탭을 정리하면 사용 중이던 작업 데이터도 사라져요.

RGBA → HEX 변환 도구가 실제로 하는 일

디자인 토큰, 오래된 스타일시트, 많은 API는 여전히 16진수 색상을 원하지만, 계산된 CSS와 최신 디자인 도구가 주는 값은 rgba()입니다. rgba(14, 165, 233, 0.65)를 손으로 변환하려면 10진수에서 16진수로의 변환 세 번에 알파 바이트 계산까지 필요합니다. RGBA → HEX 변환은 이 계산을 정확하게 수행하고, 투명도를 8자리 16진수로 유지하며, 복사하기 전에 입력을 검토할 수 있게 파싱된 채널을 보여 줍니다. 전적으로 당신의 기기에서 실행되고, 어디에도 보내지 않으며, 계정도 필요 없습니다.

자주 묻는 질문

어떤 입력 구문이 허용되나요?
쉼표로 구분된 채널을 가진 rgb(r, g, b) 또는 rgba(r, g, b, a)입니다. 빨강, 초록, 파랑은 0~255의 정수여야 하고, 알파는 0.8이나 .65 같은 0~1의 숫자여야 합니다. 대소문자는 구분하지 않고 쉼표 주변 공백도 허용합니다. rgb(50%, 30%, 20%) 같은 백분율 채널은 의도적으로 거부됩니다.
출력에 알파 바이트가 포함되는 경우는 언제인가요?
알파가 1 미만일 때뿐입니다. rgba(109, 94, 248, 0.8)은 #6D5EF8CC가 되고, 같은 색이라도 완전 불투명이면 #6D5EF8이 됩니다. 16진수 표기에 불필요한 FF가 붙는 일은 없습니다.
알파는 어떻게 마지막 바이트가 되나요?
알파에 255를 곱해 가장 가까운 정수로 반올림한 뒤, 대문자 16진수 두 자리로 적어요. 그래서 0.5는 128이 되어 80으로 표시되고, 0.65는 166으로 반올림되어 A6으로 표시됩니다. CSS가 8자리 16진수 색상에 쓰는 것과 같은 매핑입니다.
입력이 거부된 이유는 무엇인가요?
메시지가 정확한 문제를 알려 줍니다. 채널이 255를 넘었거나, 정수가 아닌 채널이 있거나, 알파가 1을 넘었거나, 형식이 rgb()나 rgba()가 아닌 경우입니다. 파서가 의도적으로 엄격한 것은 오타가 조용히 잘못된 색으로 바뀌지 않게 하기 위해서입니다. 값을 고쳐 다시 변환하면 됩니다. 변환 과정에서 무언가 전송되지는 않았습니다.
16진수를 다시 rgba()로 변환할 수 있나요?
네, HEX → RGBA 변환을 사용하세요. #RGB, #RGBA, #RRGGBB, #RRGGBBAA를 받아들이고, 각 채널을 분해해 검토할 수 있는 rgba() 문자열을 보여 줍니다.
색상이 어딘가에 업로드되나요?
아니요. 변환은 이 브라우저 탭 안에서만 실행되고, 입력값과 결과는 이 탭 밖으로 나가지 않습니다. 계정도 필요 없습니다.

디자인 카테고리에서 계속하기

막다른 길이 아니라 이어지는 작업입니다.

전체 인덱스로 돌아가지 않고 다른 집중 워크스페이스로 바로 이동합니다.

CSS 로더 생성기

CSS Loader Generator

궤도 링이나 점 세 개 로딩 스피너를 크기, 굵기, 속도, 색상 제어로 디자인하고 reduced-motion을 존중하는 CSS를 복사합니다.

생성

CSS 체크박스 생성기

CSS Checkbox Generator

크기, 테두리, 상태 색상으로 커스텀 체크박스를 꾸미고, 키보드 접근이 가능한 실제 input을 유지하는 CSS를 복사합니다.

생성

CSS 스위치 생성기

CSS Switch Generator

트랙, 썸, 두 상태 색상을 갖춘 순수 CSS 토글 스위치를 만들고 포커스와 reduced-motion 처리를 포함한 코드를 복사합니다.

생성

CSS clip-path 생성기

CSS Clip Path Generator

드래그, 키보드 또는 좌표로 다각형을 편집하세요. 네 가지 프리셋에서 시작해 clip-path 선언이나 전체 CSS를 로컬에서 복사합니다.

생성