Remix Icon
중립적인 스타일의 오픈소스 아이콘 시스템입니다. 2,800개 이상의 깔끔하고 일관된 아이콘을 제공합니다.
#FF6B6B
- 둥근 모서리
- 가는 테두리
- 보통 아이콘 선
표본
이 스타일의 규칙을 그대로 적용한 UI 컴포넌트입니다.
Remix Icon UI 아이콘
중립적이고 깔끔한 디자인 - Line 스타일
Remix Icon 특징
- ✓2,800개 이상의 중립적이고 깔끔한 아이콘
- ✓Line과 Fill 두 가지 스타일 제공
- ✓24x24 그리드 시스템으로 일관성 유지
- ✓Apache 2.0 라이선스 오픈소스
이웃 스타일
어디에 쓰나
사용 사례
- 중성적 스타일의 SaaS
- Line/Fill 혼용 디자인 시스템
- 중국계 프로젝트
이런 프로젝트에 맞습니다
- 중성적 스타일 SaaS
- Line/Fill 혼용
- 풍부한 아이콘 필요 시
더 읽기
원칙·제약·역사처럼 적용할 때 필요한 내용입니다. 필요한 항목만 펼쳐 보세요.
핵심 원칙
- npm install remixicon
- 번들 사이즈: 최적화된 SVG
- 2,800+ 아이콘
주요 특징
- 2,800개 이상의 아이콘
- 중립적이고 깔끔한 디자인
- Line과 Fill 두 스타일
- 24x24 그리드 시스템
- Apache 2.0 라이선스
장점과 한계
장점
- Line·Fill 두 스타일로 유연성
- 2,800개로 풍부한 아이콘
- 중립적 스타일로 어느 디자인에나 어울림
한계
- 국내외 인지도가 상대적으로 낮음
- 커뮤니티 규모 작음
컬러 시스템
line/fill 두 변형 — 상태에 따라 전환 가능. currentColor 기반
색의 역할
- line: 기본 상태 아이콘
- fill: active/selected 상태 아이콘
제약
- line/fill 전환 규칙 일관성 유지 (e.g. 기본=line, 활성=fill)
- 혼용 금지 — 일관된 변형 선택
다크모드 — currentColor 자동
명도 대비 — 표준 텍스트 대비 기준
타이포그래피
아이콘 패키지 — 타이포그래피 해당 없음. Remix Icon는 line/fill 두 변형 스타일
글꼴은 최대 0종 · 스케일 비율 아이콘은 4px 배수 크기 권장 (16/20/24/32/40px)
- 아이콘 크기는 인접 텍스트 font-size의 1~1.5배 권장
- line: stroke, fill: fill stroke-width — 텍스트 굵기와 시각적 균형 맞추기
설계 제약
반드시 포함
- 일관된 크기 사용 (24px 기본 권장)
- 인터랙티브 아이콘에 tooltip 또는 레이블
- hover/active 상태 색상 피드백
하지 말 것
- 아이콘 스타일 혼용 금지 — 한 프로젝트에서 패키지 1~2개만
- 아이콘 단독 사용 금지 (레이블 없을 때) — aria-label 필수
- Remix Icon 아이콘을 지나치게 크게 사용 금지 — 범용 오픈소스 최적화
모션 — 아이콘 자체 애니메이션 최소화. hover 시 opacity 변화 또는 scale 1.1 정도만.
자주 묻는 질문
Remix Icon이란 무엇인가요?
중립적인 스타일의 오픈소스 아이콘 시스템입니다. 2,800개 이상의 깔끔하고 일관된 아이콘을 제공합니다.
Remix Icon의 핵심 디자인 원칙은 무엇인가요?
Remix Icon의 핵심 원칙은 npm install remixicon, 번들 사이즈: 최적화된 SVG, 2,800+ 아이콘입니다.
Remix Icon은 어떤 프로젝트에 적합한가요?
Remix Icon은 중성적 스타일의 SaaS, Line/Fill 혼용 디자인 시스템, 중국계 프로젝트, 중성적 스타일 SaaS, Line/Fill 혼용, 풍부한 아이콘 필요 시 등의 프로젝트에 적합합니다.
Remix Icon의 장단점은 무엇인가요?
장점으로는 Line·Fill 두 스타일로 유연성, 2,800개로 풍부한 아이콘, 중립적 스타일로 어느 디자인에나 어울림이 있습니다. 단점으로는 국내외 인지도가 상대적으로 낮음, 커뮤니티 규모 작음이 있습니다.
Remix Icon에서 색상은 어떻게 사용하나요?
line/fill 두 변형 — 상태에 따라 전환 가능. currentColor 기반 색상 역할은 line: 기본 상태 아이콘, fill: active/selected 상태 아이콘입니다. 주의사항: line/fill 전환 규칙 일관성 유지 (e.g. 기본=line, 활성=fill), 혼용 금지 — 일관된 변형 선택.
Remix Icon에 어울리는 폰트 스타일은 무엇인가요?
Remix Icon에는 아이콘 패키지 — 타이포그래피 해당 없음. Remix Icon는 line/fill 두 변형 스타일 폰트가 적합합니다. 최대 0개 폰트 패밀리 사용을 권장합니다. 제약 사항: 아이콘 크기는 인접 텍스트 font-size의 1~1.5배 권장, line: stroke, fill: fill stroke-width — 텍스트 굵기와 시각적 균형 맞추기.
Remix Icon 디자인에서 하면 안 되는 것은 무엇인가요?
Remix Icon에서 피해야 할 것: 아이콘 스타일 혼용 금지 — 한 프로젝트에서 패키지 1~2개만, 아이콘 단독 사용 금지 (레이블 없을 때) — aria-label 필수, Remix Icon 아이콘을 지나치게 크게 사용 금지 — 범용 오픈소스 최적화.