Kidow

542 bookmarks
Newest
sans — Claude Code CLI 스피너를 재현한 컴포넌트 단 1종 (MIT)
sans — Claude Code CLI 스피너를 재현한 컴포넌트 단 1종 (MIT)
AI 도구를 만들면서 "작업 중" 표시를 터미널 감성으로 내고 싶을 때 참고할 파일 하나짜리다. 저장된 같은 자리와 비교하면 benday는 우리 로고를 점으로 분해해 브랜드 것으로 만드는 쪽, easeUI의 agent-loading-states와 Scrim UI의 thinking-indicator는 제품 UI 안의 범용 표시, Afterglow는 터미널 미감 전체를 덮는 세트인데, 이건 특정 CLI의 화면을 그대로 흉내 낸 단품이다. 경과 시간과 토큰 카운터까지 붙은 구성은 에이전트 실행 상태를 보여 주는 화면에서 실제로 쓸 만한 정보 조합이라 그 부분을 참고할 값이 있다. 주의 둘 — 사이트에 적힌 설치 명령이 @yourname/claude-spinner로 플레이스홀더가 그대로 남아 있으므로 레지스트리 URL(/r/claude-spinner.json, 응답 확인함)을 직접 지정해야 한다. 그리고 특정 제품의 화면을 재현한 것이므로 상업 제품에 그대로 넣기보다 구성만 참고하는 편이 안전하다.
·sans.sansorigin.com·
sans — Claude Code CLI 스피너를 재현한 컴포넌트 단 1종 (MIT)
Plotcn — Recharts·D3·Google Charts 세 엔진을 한 레지스트리에 담은 차트 49항목 (MIT, 베타)
Plotcn — Recharts·D3·Google Charts 세 엔진을 한 레지스트리에 담은 차트 49항목 (MIT, 베타)
차트 저장물이 넷이 됐고 고르는 축이 분명하다 — dashboardcn(54항목)은 차트를 KPI 카드까지 감싼 무료 세트, livedocs(31종)는 차트 자체의 종류와 완성도에 트레이딩 차트까지, Honest UI는 차트를 npm 패키지로 분리한 구조, Plotcn은 엔진을 섞어 쓰게 해 주는 쪽이다. 대시보드는 Recharts로 빠르게, 특수한 시각화는 D3로 직접, 지도나 타임라인은 Google Charts로 — 이 판단을 한 레지스트리 안에서 하게 만든 게 설계 의도다. chart-accessibility를 별도 항목으로 뺀 것도 눈에 띄는데, 저장된 차트 모음 중 접근성을 명시적 항목으로 다루는 건 이게 처음이다. 주의 둘 — Google Charts 계열은 구글이 호스팅하는 스크립트를 런타임에 불러오므로 오프라인·사내망 환경과 구글 이용약관을 확인해야 하고, 저장된 다른 차트들과 달리 외부 의존이 생긴다. 그리고 2026-09 개설에 별 0개, 스스로 베타 표기인 아주 어린 프로젝트다.
·plotcn.vercel.app·
Plotcn — Recharts·D3·Google Charts 세 엔진을 한 레지스트리에 담은 차트 49항목 (MIT, 베타)
AwwwardWinning UI — WebGL 셰이더 배경 4종과 마키 1종뿐인 초기 레지스트리 (Awwwards와 무관)
AwwwardWinning UI — WebGL 셰이더 배경 4종과 마키 1종뿐인 초기 레지스트리 (Awwwards와 무관)
배경 한 장이 필요할 때 훑어볼 다섯 항목짜리 목록이다. 저장된 배경 계열과 비교하면 uvcanvas가 가장 정돈돼 있고, ns-ui는 ASCII 계열 배경이 두꺼우며, Gamma UI는 3D 조각이 섞여 있는데, 여기 네 개는 셰이더 배경만 놓고 보면 결이 좋지만 개수가 적어 고를 폭이 없다. imposter-syndrome 셰이더처럼 여러 기상 요소를 한 화면에 넣은 것은 다른 곳에서 잘 안 보인다. 셰이더 배경은 공통적으로 GPU 부담과 모바일 프레임을 먼저 확인해야 하고, prefers-reduced-motion 대응은 각 파일에서 직접 넣어야 한다. 주의: 별 0개에 마지막 푸시가 2026-08이고 저장소에 라이선스 파일이 없어 사용 조건이 명시돼 있지 않다. 이름이 Awwwards 수상작을 연상시키지만 사이트가 직접 무관함을 밝히고 있으니 그 기대로 보지 말 것.
·awwwardedui.vercel.app·
AwwwardWinning UI — WebGL 셰이더 배경 4종과 마키 1종뿐인 초기 레지스트리 (Awwwards와 무관)
onchain-ui — 체인을 가리지 않는 wagmi+viem 기반 web3 컴포넌트 18종 (MIT)
onchain-ui — 체인을 가리지 않는 wagmi+viem 기반 web3 컴포넌트 18종 (MIT)
web3 관련 저장물이 셋이 됐는데 층이 다 다르다 — AGW Reusables는 Abstract 체인 전용(SIWE·세션 키), Lens Blocks는 Lens 프로토콜 전용, Vora UI는 시장 지표 차트이고, onchain-ui는 그중 유일하게 체인 중립적인 기본기 세트다. 지갑 연결, 주소 표시와 ENS류 아이덴티티, 체인 선택, 토큰 잔액·가격·로고, 금액 입력처럼 어떤 온체인 제품에나 들어가는 것들이라 시작점으로는 여기가 맞다. amount-input과 asset-input은 소수점 자릿수와 단위 처리 때문에 직접 만들면 실수하기 쉬운 부분이라 소스를 읽어볼 값이 있다. 주의: 별 1개에 v0.2.0인 아주 초기 프로젝트이고, wagmi·viem 버전이 고정돼 있어 프로젝트의 기존 버전과 충돌할 수 있으니 설치 전 확인할 것.
·onchain-ui.dev·
onchain-ui — 체인을 가리지 않는 wagmi+viem 기반 web3 컴포넌트 18종 (MIT)
livedocs — 대시보드용 차트 31종에 트레이딩 차트까지 더한 레지스트리 (MIT)
livedocs — 대시보드용 차트 31종에 트레이딩 차트까지 더한 레지스트리 (MIT)
차트만 필요할 때 저장된 선택지와 비교해 고를 것 — dashboardcn(54항목)은 차트를 카드 블록까지 감싼 무료 세트, Honest UI는 차트를 npm 패키지로 분리한 구조, livedocs는 차트 자체의 종류와 완성도에 집중한 쪽이고 셋 다 MIT다. livedocs만의 지점은 order-book·depth-chart·trades-feed 같은 거래 화면용 차트가 같이 있다는 것인데, 저장된 Vora UI(크립토 지표 4종)와 겹치지만 여긴 데이터 소스 없이 UI만 제공하므로 자체 데이터가 있는 쪽에 맞다. 로딩 스켈레톤이 기본으로 들어 있는 것도 실무에서 작지 않은 차이다. 주의: 개인 프로젝트 규모이고 차트 31종의 접근성(키보드·스크린리더 대응)은 직접 확인할 것.
·livedocs.xyz·
livedocs — 대시보드용 차트 31종에 트레이딩 차트까지 더한 레지스트리 (MIT)
ai2 — 변형 매트릭스와 MCP 설치를 내세운 에이전트 중심 디자인 시스템 (코어 51종 MIT)
ai2 — 변형 매트릭스와 MCP 설치를 내세운 에이전트 중심 디자인 시스템 (코어 51종 MIT)
"우리 디자인 시스템을 새로 정의하지 않고 토큰·변형 체계를 통째로 가져오고 싶을 때"가 쓰임새다. 저장된 것 중 변형 수로 승부하는 Cnippet UI(97종 + 변형 1,021)와 구조가 닮았지만, Cnippet이 전량 무료인 반면 ai2는 코어만 무료이고 체계(토큰·매트릭스·MCP 메타데이터)를 앞세운다. 실제로 값이 있는 부분은 컴포넌트 개수가 아니라 변형을 일관된 축(variant/tone/size)으로 정리한 점이므로, 도입 전에 그 축이 우리 디자인 언어와 맞는지부터 볼 것 — 맞지 않으면 307개 변형은 부담일 뿐이다. 주의: 414라는 숫자를 다른 레지스트리와 직접 비교하면 안 된다(실질 51종). 가격이 "런칭 시 인상" 문구와 함께 표시되는 파운딩 방식이므로 서두를 이유가 있는지는 별개로 판단할 것.
·ai2.design·
ai2 — 변형 매트릭스와 MCP 설치를 내세운 에이전트 중심 디자인 시스템 (코어 51종 MIT)
Verno Studio — 팔레트 테마 하나와 컴포넌트 4종만 공개한 스튜디오 레지스트리
Verno Studio — 팔레트 테마 하나와 컴포넌트 4종만 공개한 스튜디오 레지스트리
컴포넌트를 얻으러 갈 곳이 아니라 구현 방식을 읽으러 갈 곳이다. file-tree를 tree role이 아니라 중첩 disclosure로 짠 선택과 json-view에 ARIA 트리 키보드 모델을 제대로 넣은 부분은 접근성 구현 참고로 값이 있다 — 저장된 대형 레지스트리들이 이 부분을 대충 넘기는 경우가 많다. theme만 설치해 팔레트를 빌려 오는 용법도 가능한데, 이건 저장된 Token UI(토큰 문서화)나 Optics(시스템 공개)와는 또 다른 최소 단위 배포 방식이라 참고할 만하다. 주의: 항목이 5개뿐이고 제작자가 나머지는 공개하지 않겠다고 밝혔으므로 늘어날 것을 기대하지 말 것. 라이선스 표기를 찾지 못했다.
·verno-studio.vercel.app·
Verno Studio — 팔레트 테마 하나와 컴포넌트 4종만 공개한 스튜디오 레지스트리
Mischief UI — 문서 뷰어·에이전트 UI·셰이더 배경까지 한 레지스트리에 담은 117종 (MIT)
Mischief UI — 문서 뷰어·에이전트 UI·셰이더 배경까지 한 레지스트리에 담은 117종 (MIT)
넓다는 게 장점이자 성격이다 — 저장된 것 중 문서 처리는 Retab UI·Extend UI, 에이전트 UI는 Scrim UI·seamui, 셰이더 배경은 uvcanvas·ns-ui가 각각 전문인데 Mischief UI는 그 셋을 한 레지스트리에서 적당히 다 한다. 문서 파이프라인이나 에이전트 콘솔을 본격적으로 만든다면 전문 레지스트리가 낫고, 여러 성격이 섞인 제품에서 소스를 한 곳에서 가져오고 싶을 때 이쪽이 편하다. 레닥션과 바운딩박스는 문서 검수 화면에서 자주 필요하면서 저장된 항목 중 몇 안 되는 구현이다. 주의: 개별 항목의 완성도 편차를 직접 확인할 것. skill.md를 제공하므로 에이전트에게 맡길 때는 그것부터 물릴 것.
·ui.tinkererslabs.com·
Mischief UI — 문서 뷰어·에이전트 UI·셰이더 배경까지 한 레지스트리에 담은 117종 (MIT)
SevenUI — Base UI 프리미티브 65종 무료, 완성 블록 113종은 일시불 99달러
SevenUI — Base UI 프리미티브 65종 무료, 완성 블록 113종은 일시불 99달러
Base UI 계열이 저장된 것만 일곱 개가 됐는데 SevenUI의 위치는 "무료 커버리지는 충분하고 완성 페이지는 유료"다. 프리미티브 65종만 놓고 보면 Cubby UI(68)·Cnippet(97)·Blode UI(92)와 비슷한 수준이고 특별한 색채는 없다 — 대신 같은 레지스트리에서 완성 블록까지 한 번에 살 수 있다는 점이 차이다. 블록이 필요 없다면 무료분만 쓰면 되고, 그 경우 굳이 이걸 고를 이유도 크지 않다. 주의: 블록 113종의 실물은 Pro 구매 전에는 확인 범위가 제한되므로 가격 대비 판단이 어렵고, 저장소를 찾지 못해 소스 이력과 라이선스 원문을 확인하지 못했다(사이트는 프리미티브를 MIT로 표기).
·sevenui.dev·
SevenUI — Base UI 프리미티브 65종 무료, 완성 블록 113종은 일시불 99달러
seamui — 누르면 들어가고 진동하는 촉각 레이어를 깐 Base UI 컴포넌트 77종 (MIT)
seamui — 누르면 들어가고 진동하는 촉각 레이어를 깐 Base UI 컴포넌트 77종 (MIT)
모션을 개별 컴포넌트에 붙이는 게 아니라 시스템 차원의 레이어로 깔았다는 점이 이 레지스트리의 선택이다 — lib/motion.ts 한 줄로 전체 스프링을 재조정하고 프로바이더 하나로 햅틱을 켠다. 저장된 모션 계열(Tween UI는 GSAP 단품, ericts/ui는 모션 훅 묶음, Spark UI·Skecher UI는 눈길용 단품)과 층이 다르고, 오히려 Base UI 기본 세트(Cubby·basecn·Blode·fab·Lumi·Cnippet)의 대안으로 놓고 비교하는 게 맞다 — 커버리지는 비슷한데 촉감이 더해진 쪽이다. 에이전트 콘솔 계열(permission-card, plan-card, checks-panel, terminal-block)이 함께 있어 저장된 Scrim UI·easeUI와도 겹치니 둘 다 설치하지 말 것. 주의: 햅틱은 지원 기기에서만 동작하고, 모든 컨트롤이 움직이는 구성은 prefers-reduced-motion 대응을 반드시 확인해야 한다. MIT.
·seamui.dev·
seamui — 누르면 들어가고 진동하는 촉각 레이어를 깐 Base UI 컴포넌트 77종 (MIT)
Vora UI — 무료 공개 API로 도는 크립토 시장 지표 컴포넌트 4종 (MIT)
Vora UI — 무료 공개 API로 도는 크립토 시장 지표 컴포넌트 4종 (MIT)
크립토 대시보드 화면을 만들 때 쓰는 UI 부품이다. 저장된 AGW Reusables(Abstract 체인 지갑·온체인 UI)와 층이 다르다 — 그쪽이 지갑 연결과 트랜잭션이라면 여긴 시장 지표 시각화이고, 둘은 겹치지 않는다. 실무상 장점은 무료 공개 API에 이미 배선돼 있어 설치 직후 실데이터가 나온다는 점, 단점도 같은 이유다 — alternative.me와 CoinPaprika의 무료 엔드포인트에 의존하므로 호출 제한·가용성·약관을 직접 확인해야 하고, 프로덕션에서는 props로 자체 데이터 소스를 넣는 구성이 맞다. 그리고 레인보우 차트나 알트시즌 지수 같은 것은 특정 모델에 기반한 시각화일 뿐 가격 예측이나 투자 판단 근거가 아니며, 제품에 넣을 때는 그 성격이 사용자에게 오해되지 않도록 표기하는 편이 안전하다. 항목이 4개뿐인 소규모 프로젝트다.
·voraui.vercel.app·
Vora UI — 무료 공개 API로 도는 크립토 시장 지표 컴포넌트 4종 (MIT)
usva — 컴포넌트보다 디자인 언어가 먼저인 시스템 83항목 (주의: Commons Clause)
usva — 컴포넌트보다 디자인 언어가 먼저인 시스템 83항목 (주의: Commons Clause)
토큰·타이포·모션이 이미 결정된 상태로 오기 때문에 "우리 디자인 시스템을 새로 만들 여력이 없을 때" 통째로 빌려 오는 용도다. 저장된 foundation 계열과 성격 비교: HeroUI v3는 접근성 중심의 완성형, Supabase Design System·Optics는 실제 제품의 시스템 공개, tetra ui는 React Native 전용이고, usva는 미감과 분위기까지 포함해 가장 의견이 강하다 — 그 말은 우리 브랜드가 있으면 충돌한다는 뜻이기도 하다. ★라이선스 주의★ MIT가 아니라 MIT + Commons Clause다. 내 애플리케이션·웹사이트·제품에 넣어 상업적으로 쓰는 것은 허용되지만, 컴포넌트 자체를 단독으로든 묶음으로든 이식판으로든 판매·재라이선스·재배포하는 것은 금지된다. 사내 공용 디자인 시스템으로 다른 팀에 배포하는 형태라면 조건을 먼저 확인할 것.
·usva.build·
usva — 컴포넌트보다 디자인 언어가 먼저인 시스템 83항목 (주의: Commons Clause)
Pipecat UI — 음성 AI 프레임워크 Pipecat 공식 컴포넌트 21종 (BSD-2)
Pipecat UI — 음성 AI 프레임워크 Pipecat 공식 컴포넌트 21종 (BSD-2)
Pipecat으로 음성 에이전트를 만들 때만 의미가 있다 — 다른 음성 스택에는 그대로 안 붙는다. 값은 비주얼라이저보다 운영 쪽에 있다: 마이크·카메라·화면공유 권한 토글, 장치 선택, 연결 상태, 세션 정보, 실시간 지표와 이벤트 스트림 콘솔은 음성 앱에서 반드시 필요하면서 직접 만들면 지저분해지는 부분이다. 저장된 Scrim UI에도 voice-input·voice-waveform·voice-call-controls가 있지만 그쪽은 스택 중립적인 UI이고, 여긴 Pipecat 클라이언트에 배선까지 된 것이라 층이 다르다. 주의: 라이선스가 BSD 2-Clause로 저장된 대부분(MIT)과 다르며 고지 의무 방식이 조금 다르다. 의존성 버전이 Pipecat 클라이언트에 고정돼 있어 프레임워크 업그레이드와 함께 움직인다는 점도 감안할 것.
·ui.pipecat.ai·
Pipecat UI — 음성 AI 프레임워크 Pipecat 공식 컴포넌트 21종 (BSD-2)
uiception — 같은 섹션을 버전별로 모아 둔 랜딩 블록 132종 (MIT)
uiception — 같은 섹션을 버전별로 모아 둔 랜딩 블록 132종 (MIT)
섹션을 고를 때 "같은 자리의 다른 안"을 나란히 보고 싶을 때. 저장된 블록 모음 중 Hex UI(33)는 종류별 한두 개, Beste UI는 대부분 유료, NavUI는 일러스트가 강점인데, uiception은 한 종류를 10개 안팎으로 쌓아 둔 구조라 Cnippet UI가 컴포넌트에서 한 일을 섹션에서 한 셈이다. 전량 무료 MIT라 고르는 비용이 없다. 주의: 설치 한 번에 페이지 라우트와 이미지 폴더까지 같이 생성되는 구조라(사이트 예시에 33개 파일 생성) 기존 프로젝트에 넣을 때 무엇이 어디에 깔리는지 먼저 확인할 것. 개인 프로젝트이고 이번 조사에서 GitHub API 한도로 별 수·최근 푸시는 확인하지 못했다.
·uiception.com·
uiception — 같은 섹션을 버전별로 모아 둔 랜딩 블록 132종 (MIT)
Token UI — 디자인 토큰 문서를 그리는 전용 컴포넌트 17종 (Storybook·MDX)
Token UI — 디자인 토큰 문서를 그리는 전용 컴포넌트 17종 (Storybook·MDX)
컴포넌트를 만드는 도구가 아니라 디자인 시스템 문서를 만드는 도구다. 저장된 것 중에는 Supabase Design System이나 Optics처럼 "잘 만든 문서"를 참고하는 항목은 있었지만, 그 문서 페이지를 구성하는 부품을 파는 항목은 이게 처음이다. 사내 디자인 시스템 문서를 Storybook이나 MDX로 운영한다면 토큰 표를 매번 표 태그로 짜는 대신 이걸 쓰는 구성이 가능하고, 특히 color-contrast로 대비비를 문서에 박아 두는 건 접근성 기준을 팀에 강제하는 실질적 방법이다. 주의: 17개뿐이라 문서 사이트의 나머지(내비게이션, 예제 렌더러)는 직접 만들어야 하고, 저장소에 라이선스 파일을 찾지 못해 사용 조건이 불명확하다.
·tokenui.dev·
Token UI — 디자인 토큰 문서를 그리는 전용 컴포넌트 17종 (Storybook·MDX)
Scrim UI — AI 제품 UI를 가장 넓게 덮는 컴포넌트 55종 + 완성 패턴 12종 (무료분 MIT)
Scrim UI — AI 제품 UI를 가장 넓게 덮는 컴포넌트 55종 + 완성 패턴 12종 (무료분 MIT)
AI UI 계열 저장물이 이미 여럿인데 범위로 보면 이게 가장 넓다 — assistant-ui는 런타임까지 포함한 프리미티브, Tool UI(현 assistant-ui Elements)는 툴 호출 결과 표시, GAIA UI는 실제 어시스턴트에서 떼어낸 대화 UI, Kobra·Neon UI·easeUI는 각자 키트 안의 AI 묶음인데, Scrim UI는 승인 게이트·핸드오프·평가 결과·거절 메시지·모더레이션 플래그·비용 미터처럼 에이전트를 실제로 운영할 때 필요한 화면까지 항목으로 갖고 있다. 만들려는 것이 챗 UI가 아니라 에이전트 콘솔이라면 여기부터 볼 것. 블록 12종이 앱 한 벌 단위라 구조 참고용으로도 값이 있다. 주의: 가격 페이지가 404라 Pro 조건이 확인되지 않고, 무료분이 MIT라는 것은 사이트 푸터 표기에 따른 것이다. 저장소 링크가 사이트에 없어 소스 이력을 확인하기 어렵다는 점도 감안할 것.
·scrimui.dev·
Scrim UI — AI 제품 UI를 가장 넓게 덮는 컴포넌트 55종 + 완성 패턴 12종 (무료분 MIT)
nostalgia-ui — Mac OS 9를 이미지 없이 CSS로 재현한 컴포넌트 78종 + 화면 12종
nostalgia-ui — Mac OS 9를 이미지 없이 CSS로 재현한 컴포넌트 78종 + 화면 12종
레트로 테마 계열에서 가장 완성도 높은 축이다 — 저장된 The Gridcn(SF HUD), 8bit/cnlibs(픽셀), Afterglow(CRT 터미널)와 나란히 두면 이건 특정 OS의 외형을 정밀하게 재현한 쪽이고, 78종으로 표준을 덮으므로 부분 장식이 아니라 사이트 전체를 그 시절로 만들 수 있다. sad-mac-404나 unexpectedly-quit 같은 블록은 404·에러 페이지에 그대로 쓰기 좋다. 이미지 없이 CSS만으로 구현한 점은 번들과 해상도 양쪽에서 이득이다. 주의 둘 — 애플의 실제 OS 외형을 재현한 것이므로 상업 제품, 특히 애플과 인접한 제품에서 쓸 때는 한 번 생각해 볼 것. 그리고 저장소에 라이선스 파일을 찾지 못했다.
·nostalgia-ui.com·
nostalgia-ui — Mac OS 9를 이미지 없이 CSS로 재현한 컴포넌트 78종 + 화면 12종
AtroUI — 개인 사이트용 블록에 서버 API 라우트까지 같이 설치하는 레지스트리 (MIT)
AtroUI — 개인 사이트용 블록에 서버 API 라우트까지 같이 설치하는 레지스트리 (MIT)
개인 사이트나 1인 제품 랜딩을 빨리 세울 때. 저장된 다른 블록 모음과 구분되는 지점은 UI가 아니라 라우트다 — 문의 폼이나 대기자 명단은 화면보다 서버 처리와 스팸 방어가 일인데, 그 라우트를 소스로 같이 설치하고 키는 내 환경에 두는 구성은 이 목록에서 드물다. 폼 UI만 필요하면 nekode/ui나 Better Auth UI가 낫고, 여긴 "폼 + 받는 쪽"이 한 세트라는 게 이유다. 블록 자체는 개인 사이트 톤이라 B2B SaaS 랜딩에는 결이 안 맞을 수 있다. 주의: api-generate·api-scope처럼 AI 호출을 전제한 라우트가 있으므로 설치 전 어떤 외부 서비스와 어떤 키를 요구하는지 소스에서 확인할 것. MIT.
·atroui.com·
AtroUI — 개인 사이트용 블록에 서버 API 라우트까지 같이 설치하는 레지스트리 (MIT)
AtomLoader — 점 행렬 로딩 인디케이터 591종, 의존성 0 순수 CSS (라이선스 미표기)
AtomLoader — 점 행렬 로딩 인디케이터 591종, 의존성 0 순수 CSS (라이선스 미표기)
스피너를 하나 고르면 되는 상황에 591개는 과하지만, 브랜드 톤에 맞는 로딩 모양을 찾을 때 후보 폭으로는 압도적이다. 저장된 loading.dev(27종)가 흔한 스피너를 정리한 쪽이라면 여긴 점 행렬이라는 한 가지 문법으로 변주만 뽑은 구조다 — 즉 591개가 서로 다른 아이디어가 아니라 같은 재료의 조합이라는 점을 감안할 것. 의존성 0에 순수 CSS라 번들 부담이 없고 파일 하나만 가져오면 되는 것이 실질적 장점이다. 주의: 저장소에 라이선스 파일이 없어 사용 조건이 명시돼 있지 않다. 이번 조사에서 GitHub API 한도로 별 수와 최근 푸시를 확인하지 못했으니 도입 전 저장소 상태를 직접 볼 것.
·atomloader.roothq.tech·
AtomLoader — 점 행렬 로딩 인디케이터 591종, 의존성 0 순수 CSS (라이선스 미표기)
ilinxa pro-ui — 칸반·간트·PDF 뷰어급 완성 컴포넌트 모음 (알파 v0.1.0)
ilinxa pro-ui — 칸반·간트·PDF 뷰어급 완성 컴포넌트 모음 (알파 v0.1.0)
프리미티브가 아니라 화면 한 덩어리를 통째로 가져오는 성격이라 저장된 대부분과 층이 다르다 — 칸반 보드나 간트 타임라인, 파일 매니저를 직접 만들면 며칠이 걸리는 것들이다. 각 컴포넌트에 -fixtures를 붙여 예제 데이터까지 같이 설치할 수 있는 것도 이 규모의 컴포넌트에서는 실용적이다. 다만 덩어리가 클수록 우리 데이터 모델과 안 맞을 위험도 커지므로, 설치 전에 fixtures 버전으로 먼저 돌려 보고 구조가 맞는지 확인하는 순서가 맞다. 주의: 스스로 v0.1.0 ALPHA라고 밝히고 있고 사이트에 저장소 링크나 라이선스 표기가 없어 사용 조건이 불명확하다 — 앱 핵심 화면을 이걸로 채우기 전에 반드시 확인할 것.
·ui.ilinxa.com·
ilinxa pro-ui — 칸반·간트·PDF 뷰어급 완성 컴포넌트 모음 (알파 v0.1.0)
D2 Studio UI — 스피너 10종과 벤토·AI 블록이 섞인 SaaS 랜딩용 모음 (Pro 별도)
D2 Studio UI — 스피너 10종과 벤토·AI 블록이 섞인 SaaS 랜딩용 모음 (Pro 별도)
스피너 10종처럼 한 종류를 여러 안으로 모아 둔 부분이 이 모음의 실제 쓸모다. 벤토·히어로·가격 블록은 저장된 Hex UI, NavUI, Beste UI 무료분과 겹치므로 굳이 여기서 가져올 이유는 적다. 실무 주의는 의존성 — gsap와 cobe, nucleo-glass까지 항목마다 다른 라이브러리가 붙으므로 하나 설치할 때마다 무엇이 따라오는지 확인해야 한다(저장된 Gamma UI, Skecher UI와 같은 문제다). 사이트 표기(50+)와 실측(40)이 다르다는 점, 그리고 GitHub 저장소는 있으나 이번 조사에서 API 한도로 라이선스를 확인하지 못했다는 점을 기록해 둔다 — 상업 사용 전 저장소의 LICENSE를 직접 확인할 것.
·ui.d2studio.dev·
D2 Studio UI — 스피너 10종과 벤토·AI 블록이 섞인 SaaS 랜딩용 모음 (Pro 별도)
liquefy-ui — WebGL 굴절과 스프링 물리를 넣은 리퀴드 글래스 34종 (MIT, v0.1)
liquefy-ui — WebGL 굴절과 스프링 물리를 넣은 리퀴드 글래스 34종 (MIT, v0.1)
글래스 계열 여섯 번째인데 무게로 줄을 세우면 맨 위쪽이다 — Plasma UI가 WebGL 패널 몇 개라면 liquefy-ui는 WebGL 굴절을 재질로 깔고 표준 컴포넌트 34종을 그 위에 올린 구조라 전면 적용을 전제한다. glasscn(CSS+SVG)·Ein UI(44, 부분 추가)·Glass UI(49, shadcn 1:1 교체)·washiveil(58, 종이 톤)과 비교하면 시각적 완성도는 가장 높지만 GPU 비용도 가장 크다. 저사양 기기와 모바일에서 프레임을 먼저 확인하고, 접근성 측면에서 굴절·모션을 끌 수 있는 경로를 마련할 것. 주의: 사이트가 v0.1이라 API가 굳지 않았고 별 4개의 신생 프로젝트다(2026-07 개설, 2026-09까지 활발). 패키지 의존(@liquefy-ui/core)이 있어 완전한 소스 소유형은 아니다. MIT.
·liquefy-ui.com·
liquefy-ui — WebGL 굴절과 스프링 물리를 넣은 리퀴드 글래스 34종 (MIT, v0.1)
KaUI — 비동기 상태 처리와 폼 입력을 다루는 소형 애드온 10항목 (라이선스 미표기)
KaUI — 비동기 상태 처리와 폼 입력을 다루는 소형 애드온 10항목 (라이선스 미표기)
열 개짜리 참고 목록이지만 초점이 분명하다 — 다른 레지스트리가 잘 안 다루는 "비동기 상태"를 묶어 놓았다. async-button과 use-async, async-scope는 저장·삭제 버튼의 로딩·성공·실패 표현을 매번 다시 짜는 문제를 겨냥한 것이라 코드를 읽어볼 값이 있다. 반면 combobox·multi-select·input-group·password-input은 저장된 nekode/ui나 Blode UI 쪽이 더 정돈돼 있으니 그쪽을 먼저 볼 것. 주의 둘 — 저장소에 라이선스 파일이 없어 사용 조건이 명시돼 있지 않고, password-input이 zxcvbn 사전(영어·독일어)을 의존성으로 끌고 와 번들이 꽤 커진다. 한국어 서비스라면 사전이 맞지 않는다는 점도 감안할 것.
·kaui-shadcn-registry.vercel.app·
KaUI — 비동기 상태 처리와 폼 입력을 다루는 소형 애드온 10항목 (라이선스 미표기)
easeUI — 이징·스프링을 미리 맞춰 둔 컴포넌트 53종, AI 에이전트 UI 포함 (무료 MIT + Pro)
easeUI — 이징·스프링을 미리 맞춰 둔 컴포넌트 53종, AI 에이전트 UI 포함 (무료 MIT + Pro)
에이전트 UI를 만들 때 특히 볼 만하다 — tool-approval(도구 실행 승인)과 agent-loading-states처럼 저장된 다른 AI 컴포넌트 모음(GAIA UI, Kobra, Neon UI, Elements)에서도 잘 안 보이는 조각이 있다. 나머지 연출 컴포넌트는 Spark UI·Skecher UI와 겹치므로 중복 설치를 피할 것. 의존성이 가벼운 것도 장점이다. 주의: 2026-09-14 개설에 별 4개로 아주 어린 프로젝트이고, 무료 50종과 유료 Pro가 별도 사이트로 갈려 있어 문서를 오가야 한다. 유료 조건은 구독이 아니라 연 99달러/라이프타임 159달러의 소스 소유 방식이다.
·easeui.dev·
easeUI — 이징·스프링을 미리 맞춰 둔 컴포넌트 53종, AI 에이전트 UI 포함 (무료 MIT + Pro)
washiveil — 화지 바탕에 유리 막을 얹은 글래스 세트 58종, 중·일 타이포 고려 (MIT)
washiveil — 화지 바탕에 유리 막을 얹은 글래스 세트 58종, 중·일 타이포 고려 (MIT)
글래스 계열이 이미 여럿인데 이건 미감이 다른 축이다 — Glass UI(49종)는 애플식 차가운 유리로 shadcn을 1:1 교체하는 쪽, Ein UI(44)는 부분 추가용, glasscn(65)은 CSS+SVG 필터, Plasma UI는 WebGL 실굴절이고, washiveil은 차가운 유리 대신 따뜻한 종이 바탕에 막을 얹어 색온도 자체가 다르다. 전면 교체가 가능한 규모(58종)라 톤을 통째로 바꿀 때 후보가 된다. 실무에서 눈여겨볼 지점은 CJK 타이포그래피를 나중에 덧붙이지 않고 처음부터 넣었다는 점이다 — 다만 명시된 대상은 중국어 번체와 일본어이고 한국어는 언급이 없으므로, 한글 조판(자간·줄간격·폰트 폴백)은 직접 확인하고 조정해야 한다. 주의: 2026-08 개설에 별 5개인 신생 1인 프로젝트다. MIT.
·washiveil.alexchih.com·
washiveil — 화지 바탕에 유리 막을 얹은 글래스 세트 58종, 중·일 타이포 고려 (MIT)
slidecn — reveal.js로 슬라이드를 코드로 만드는 컴포넌트 26항목 (MIT)
slidecn — reveal.js로 슬라이드를 코드로 만드는 컴포넌트 26항목 (MIT)
발표 자료를 슬라이드 도구 대신 코드로 관리하고 싶을 때 — 버전 관리가 되고 수치나 차트를 실제 데이터에 연결할 수 있다는 게 이 방식의 이유다. 저장된 영상 계열(RemotionUI·snapcn)이 "결과물을 렌더"한다면 이건 브라우저에서 바로 발표하는 쪽이고, 둘 다 코드로 만든다는 점만 같다. auto-animate-pair와 fragment 래퍼가 있어 reveal.js 기능을 직접 배우지 않고도 전환을 줄 수 있다. 주의 둘 — GitHub 조직명이 shadcn-labs이지만 shadcn 공식(shadcn-ui)과 무관한 개인 프로젝트다(제작자 Aniket Pawar). 그리고 마지막 푸시가 2026-06-17로 석 달 넘게 멈춰 있다. MIT.
·slidecn.vercel.app·
slidecn — reveal.js로 슬라이드를 코드로 만드는 컴포넌트 26항목 (MIT)
GamifyKit — 연속 출석·업적·리더보드 3종뿐인 게임화 키트 (MIT)
GamifyKit — 연속 출석·업적·리더보드 3종뿐인 게임화 키트 (MIT)
학습 앱이나 커뮤니티에 출석·업적·랭킹을 붙일 때 화면을 처음부터 그리지 않으려는 용도. 세 개뿐이라 라이브러리가 아니라 참고 구현 세 개로 봐야 하고, 실제로 필요한 것의 대부분(포인트 적립 규칙, 뱃지 지급 조건, 기간별 랭킹 집계)은 서버 쪽 일이라 여기서 얻을 수 있는 건 UI 형태뿐이다. 그 점을 감안하면 값이 분명한 건 leaderboard와 daily-streak 정도다. 주의: 2025-11 개설인데 항목이 3개에 머물러 있고 마지막 푸시가 2026-07이라 성장 중인 프로젝트로 기대하지 말 것. MIT에 의존성이 없어 파일을 복사해 고쳐 쓰는 부담은 없다.
·gamifykit.com·
GamifyKit — 연속 출석·업적·리더보드 3종뿐인 게임화 키트 (MIT)
NavUI — 랜딩 섹션 블록 41종에 일러스트까지 넣은 개인 레지스트리 (MIT)
NavUI — 랜딩 섹션 블록 41종에 일러스트까지 넣은 개인 레지스트리 (MIT)
랜딩을 빨리 세울 때 훑는 목록 중 하나인데, 같은 섹션 계열 저장물 사이에서 고를 이유는 일러스트와 개발자용 조각이다 — 모션 들어간 SaaS 일러스트를 코드로 제공하는 레지스트리는 드물고, contribution-graph나 package-manager-command는 개발자 도구 랜딩에서 자주 필요하면서 매번 새로 만드는 것들이다. 섹션 자체의 수와 다양성만 보면 Hex UI(33 블록)나 Beste UI 무료분과 비슷한 수준이다. 주의: 개인 포트폴리오 저장소 안에 함께 들어 있는 형태라 독립 프로젝트로서의 유지보수 약속이 없고(마지막 푸시 2026-08-24), 별 6개다. MIT라 파일 단위로 가져다 쓰는 데는 제약이 없다.
·ui.navdeepsingh.dev·
NavUI — 랜딩 섹션 블록 41종에 일러스트까지 넣은 개인 레지스트리 (MIT)
Honest UI — 복사형 컴포넌트와 npm 패키지(차트·아이콘·이펙트)를 나눠 담은 라이브러리 (MIT)
Honest UI — 복사형 컴포넌트와 npm 패키지(차트·아이콘·이펙트)를 나눠 담은 라이브러리 (MIT)
컴포넌트는 소유하고 차트·아이콘은 패키지로 받는 혼합 방식이 이 라이브러리의 선택이다. 소스 복사형 일색인 다른 저장 항목들과 달라서, 차트를 버전업으로 관리하고 싶다면 이 구조가 오히려 편하다 — 반대로 차트를 뜯어고칠 생각이면 복사형인 dashboardcn 쪽이 맞다. 비주얼 이펙트 묶음(dither, grainient, light-rays, chromatic-*)은 저장된 uvcanvas·Gamma UI 계열과 겹치지만 여기 것은 패키지 import라 설치가 가볍다. 주의: 2026-07-27 개설에 별 6개이고 npm 패키지가 0.2.0이라 API가 굳지 않았다. 컴포넌트와 패키지 두 갈래를 동시에 유지해야 하는 구조라 소규모 프로젝트에서 부담이 될 수 있다는 점도 지켜볼 것. MIT.
·honestui.com·
Honest UI — 복사형 컴포넌트와 npm 패키지(차트·아이콘·이펙트)를 나눠 담은 라이브러리 (MIT)
Blode UI — Tailwind v4 전용 Base UI 컴포넌트 92종에 실무 입력기를 더한 세트 (MIT)
Blode UI — Tailwind v4 전용 Base UI 컴포넌트 92종에 실무 입력기를 더한 세트 (MIT)
Base UI 계열 여섯 번째인데 고르는 기준은 "무엇이 들어 있나"다 — Cubby UI(68+훅4)와 basecn(61)은 표준 커버리지, Lumi UI는 조합 예시, fab ui는 연출 섞기, Cnippet은 변형 수, Blode UI는 전화번호·통화·시간대·폰트 선택기처럼 실제 폼에서 매번 걸리는 입력기를 갖춘 쪽이다. 그 항목들만 떼어 써도 값이 있다. AI 대화 묶음이 함께 있는 것도 요즘 흐름이고 저장된 Neon UI·GAIA UI와 비교 가능하다. 주의: Tailwind v4 전용이라 v3 프로젝트에는 그대로 들어가지 않고, 별 6개의 1인 프로젝트다(2026-09까지 활발). MIT.
·blode.co·
Blode UI — Tailwind v4 전용 Base UI 컴포넌트 92종에 실무 입력기를 더한 세트 (MIT)