디자인 및 브랜드 리소스

색상 스케일을 생성하고 대비를 비교하며 접근성 높은 인터페이스를 설계할 수 있습니다.

Adobe의 공개 색상 도구로 색상 조합을 탐색하고 팔레트를 만들 수 있습니다.

비슷한 글자 형태를 쉽게 구별하도록 설계된 무료 글꼴 모음입니다.

Atlassian에서 공개한 인터페이스 기초, 컴포넌트, 디자인 지침입니다.

웹사이트, 슬라이드, 제품 이미지용 벡터 배경을 생성할 수 있습니다.

SVG, 스프라이트, 아이콘 폰트로 제공되는 오픈 소스 인터페이스 아이콘입니다.

무료 인터페이스 아이콘입니다. 원본 사이트에서 출처 표기와 컴포넌트 라이선스를 설명합니다.

개인정보 보호를 중시하는 글꼴 호스팅 서비스와 오픈 소스 글꼴 카탈로그입니다.

비즈니스와 전자상거래 용도별로 정리된 무료 스톡 사진입니다.

엄선된 색상 팔레트를 살펴보고 색상 값을 복사해 브랜드의 시각적 방향을 잡을 수 있습니다.

색상 조합의 가독성을 확인하고 목표 대비에 맞게 조정할 수 있습니다.

무료 브라우저 생성기로 색상 팔레트를 탐색할 수 있습니다. 프리미엄 기능은 별도로 제공됩니다.

협업으로 제품 흐름, 아키텍처 다이어그램, 초기 아이디어를 스케치할 수 있습니다.

인터페이스에 맞게 크기와 색상을 조정할 수 있는 단순한 윤곽선 SVG 아이콘입니다.

인터페이스 디자인을 살펴볼 수 있는 Figma의 무료 Starter 요금제입니다. 협업에는 제한이 있습니다.

유료 Pro 카탈로그와 별도로 제공되는 무료 아이콘 모음을 검색할 수 있습니다.

개방형 라이선스 글꼴 모음을 살펴보고 각 글꼴의 라이선스를 확인할 수 있습니다.

웹사이트와 브랜드 타이포그래피에 사용할 무료 글꼴 조합을 탐색할 수 있습니다.

개인 및 상업 프로젝트에 사용할 수 있는 Indian Type Foundry의 무료 서체입니다.

접근성 높은 서비스 패턴, 컴포넌트, 연구에 기반한 디자인 지침입니다.

GitHub의 오픈 소스 인터페이스 패턴과 기반 컴포넌트입니다.

웹사이트, 앱, 브랜드 타이포그래피를 위한 오픈 소스 글꼴 모음입니다.

브라우저에서 SVG 배경, 물결, 도형, 레이어 구성을 생성할 수 있습니다.

예시 페이지에 적용된 색상 팔레트를 확인한 후 브랜드 팔레트를 선택할 수 있습니다.

React와 Vue 인터페이스를 위한, 스타일이 지정되지 않은 접근성 컴포넌트입니다.

전경색과 배경색을 조정할 수 있는 반복형 SVG 패턴입니다.

Tailwind CSS 팀에서 제공하는 윤곽선 및 채움형 인터페이스 아이콘입니다.

자세와 의상을 바꿀 수 있는 모듈형 인물 일러스트 라이브러리입니다.

컴포넌트, 패턴, 접근성 지침을 제공하는 오픈 소스 디자인 시스템입니다.

제품 및 브랜드 시스템을 위한 오픈 소스 산세리프, 세리프, 고정폭 서체입니다.

재사용 가능한 캐릭터, 사물, 배경을 조합해 일러스트 장면을 만들 수 있습니다.

프레임워크 라이브러리도 제공하는 오픈 소스 SVG 아이콘입니다. 원본 사이트에서 다음 제품이나 출시에 사용할 소재를 선택하세요.

제품 인터페이스의 가독성을 위해 설계된 가변 서체입니다.

일관된 윤곽선 아이콘을 SVG 다운로드와 프레임워크 패키지로 제공합니다.

웹사이트, 프레젠테이션, 마케팅 콘텐츠를 위한 무료 일러스트 갤러리입니다.

Google이 공개한 디지털 제품용 디자인 지침, 컴포넌트, 패턴입니다.

굵기와 채움을 조절할 수 있는 Google의 가변 심볼 모음입니다.

흑인과 갈색 피부의 사람들을 담아 더 다양한 사람들을 표현할 수 있는 무료 사진입니다.

제품 및 개발자 인터페이스를 위한 GitHub의 오픈 소스 아이콘입니다.

CC0로 공개되어 재사용할 수 있는 손그림 일러스트입니다. 원본 사이트에서 다음 제품이나 출시에 사용할 소재를 선택하세요.

인물 요소를 자유롭게 조합해 프레젠테이션과 제품 장면을 만들 수 있는 일러스트 라이브러리입니다.

간격, 타이포그래피, 색상, 모션을 위한 오픈 소스 CSS 디자인 토큰입니다.

개방형 라이선스 디자인 도구, 에셋, 학습 자료를 범주별로 정리한 디렉터리입니다.

무료 요금제와 자체 호스팅 옵션을 제공하는 오픈 소스 인터페이스 디자인 도구입니다.

인터페이스, 다이어그램, 프레젠테이션에 사용할 수 있는 다양한 굵기의 아이콘 모음입니다.

레이어 그래픽, 목업, 일반적인 디자인 형식을 처리하는 무료 브라우저 이미지 편집기입니다.

정보 밀도가 높은 제품 UI를 위해 설계된 작은 인터페이스 아이콘입니다.

제품 디자인 시스템을 구축하기 위한, 스타일이 지정되지 않은 접근성 UI 기본 요소입니다.

예시 웹사이트 레이아웃에서 타이포그래피와 색상 조합을 미리 볼 수 있습니다.

웹과 모바일 인터페이스를 위한 일관된 아이콘 모음입니다. 원본 사이트에서 다음 제품이나 출시에 사용할 소재를 선택하세요.

무료로 명시된 배경과 패턴 모음을 수정하고 다운로드할 수 있습니다.

SVG 파일을 시각적으로 최적화하고 다운로드 전에 용량 변화를 확인할 수 있습니다.

Shopify가 공개한 판매자용 제품 인터페이스 지침과 컴포넌트입니다.

SVG 브랜드 로고입니다. 각 브랜드의 상표 및 사용 지침을 확인하세요.

웹사이트를 게시하기 전에 브라우저에서 이미지를 압축하고 형식을 비교할 수 있습니다.

출처 표기가 필요한 맞춤형 무료 일러스트입니다.

프레임워크 패키지도 제공하는 대규모 SVG 인터페이스 아이콘 모음입니다.

각각의 글꼴 라이선스를 가진 독립 오픈 소스 서체입니다.

무료 도구로 제목과 본문의 모듈형 글꼴 크기 스케일을 탐색할 수 있습니다.

무료 글꼴 추천을 찾아보고 원본 링크에서 각 글꼴의 라이선스를 확인할 수 있습니다.

미국 정부에서 제공하는 접근성 디자인 컴포넌트와 지침입니다.

WCAG 비율에 따라 전경색과 배경색의 대비를 확인할 수 있습니다.

파일별 라이선스와 출처 표기 정보를 확인하며 재사용 가능한 미디어를 찾을 수 있습니다.

CSS, SVG, 프레임워크 컴포넌트로 배포되는 가벼운 아이콘입니다.

로컬 파일 옵션이 있는 무료 편집기로 다이어그램과 순서도를 만들 수 있습니다.

웹사이트와 제품 화면을 위한 오픈 소스 일러스트 라이브러리입니다.

자신의 코드베이스에 복사해 수정할 수 있는 오픈 소스 인터페이스 컴포넌트입니다.

랜딩 페이지와 제품 설명에 사용할 수 있는 편집 가능한 일러스트입니다.

Fluent 2 Design System은 디자인 또는 접근성 참고 자료를 제공합니다. 코드, 문서와 그래픽의 라이선스가 다를 수 있으므로 재사용 전에 원본 라이선스를 확인하세요.

Ant Design은 디자인 또는 접근성 참고 자료를 제공합니다. 코드, 문서와 그래픽의 라이선스가 다를 수 있으므로 재사용 전에 원본 라이선스를 확인하세요.

PatternFly은 디자인 또는 접근성 참고 자료를 제공합니다. 코드, 문서와 그래픽의 라이선스가 다를 수 있으므로 재사용 전에 원본 라이선스를 확인하세요.

Zendesk Garden은 디자인 또는 접근성 참고 자료를 제공합니다. 코드, 문서와 그래픽의 라이선스가 다를 수 있으므로 재사용 전에 원본 라이선스를 확인하세요.

W3C Web Accessibility Tutorials은 디자인 또는 접근성 참고 자료를 제공합니다. 코드, 문서와 그래픽의 라이선스가 다를 수 있으므로 재사용 전에 원본 라이선스를 확인하세요.

Radix Colors은 디자인 또는 접근성 참고 자료를 제공합니다. 코드, 문서와 그래픽의 라이선스가 다를 수 있으므로 재사용 전에 원본 라이선스를 확인하세요.