App Foundations

아이콘

제품 UI 아이콘은 2026-06 재스킨으로 icon() 라인 SVG(1.8px 스트로크 · 24×24 · currentColor)로 통일됐습니다 — 마케팅/External과 동일 세트. 앱 코드는 ui('name') 헬퍼로 호출하고, ui()가 내부에서 icon()으로 매핑(레거시 uicon 이름은 별칭으로 흡수). 브랜드/플랫폼 로고만 별도(brand_icon · uicons-brands).

사이즈

두 번째 인자로 px 지정 — ui('chart',18) / icon('chart',18). 내비 18px · 상단바 16–18px · 인라인 14px.

14px

16px

18px

22px

세트

icon() 라인 SVG 세트(스트로크 1.8px). 앱·마케팅 공통 — 한 세트로 통일해 일관성 유지.

home

link

chart

users

plus

calendar

megaphone

music

globe

check

trash

edit

download

upload

copy

eye

eye-off

lock

grid

coin

paper-plane

comment

star

settings

bell

target

flame

rocket

mail

tag

clock

shield

doc

picture

arrow-right

arrow-left

chevron-right

bolt

devices

newspaper

list-check

diamond

cursor

percentage

thumbtack

sparkle

external

radio

ticket

vote

hashtag

play

folder

logout

code

레거시 호출 ui('chart-histogram') 등은 ui() 별칭맵으로 자동 매핑 · 브랜드 로고는 brand_icon('spotify')

사용 규칙

권장

· 앱 코드는 ui('name'), 마케팅은 icon('name') — 같은 SVG 세트
· 색은 currentColor 상속 — 보통 muted, active는 퍼플
· 사이즈는 인자로 — 내비 18px · 인라인 14px
· 브랜드/플랫폼 로고는 brand_icon()

금지

· 새 코드에 <i class="fi fi-rr-*"> 직접 사용(uicons 폰트)
· 다른 아이콘 세트/스트로크 두께 혼용
· 이모지로 아이콘 대체
· 의미 없는 장식용 남용