Tailwind CSS에 클래스 이름으로 바로 사용할 수 있는 UI 컴포넌트를 추가하는 무료 오픈소스 라이브러리입니다.
taiga-family/taiga-ui
트리 셰이킹 가능한 보조 엔트리 포인트와 CSS 사용자 지정 속성 테마를 갖춘 130개 이상의 컴포넌트와 100개 이상의 디렉티브를 제공하는 Angular UI 키트입니다.
- 스타
- 4,085
- 포크
- 584
- 열린 이슈
- 141
- 마지막 커밋
- 19시간 전
어떤 프로젝트인가요?
Taiga UI는 여러 기본 패키지와 애드온으로 구성된 Angular 컴포넌트 라이브러리입니다. 동적 콘텐츠에는 ng-polymorpheus 접근 방식을 사용하고, 브라우저에 접근할 때는 Web APIs for Angular를 활용합니다.
각 엔티티는 보조 엔트리 포인트로 제공되므로 컴포넌트 하나만 가져오면 해당 컴포넌트의 코드만 번들에 포함됩니다. 스타일링에는 CSS 사용자 지정 속성을 사용하며, 다크 테마가 기본 제공됩니다. 컴포넌트는 OnPush 변경 감지를 사용하고, 프로젝트는 엄격한 TypeScript 모드로 작성되었습니다.
현재 메이저 버전인 5.x는 Angular 19 이상을 대상으로 합니다. 저장소에는 2.x와 3.x 버전용 Figma 라이브러리도 포함되어 있으며, 5.x용 Figma 라이브러리는 아직 작업 중입니다.
핵심 기능
- 01보조 엔트리 포인트를 사용해 트리 셰이킹을 지원하므로 가져온 컴포넌트만 번들에 포함됩니다.
- 02CSS 사용자 지정 속성으로 스타일을 지정하며, 다크 테마가 기본 제공됩니다.
- 03130개 이상의 컴포넌트와 100개 이상의 디렉티브, 토큰, 유틸리티 및 도구를 제공합니다.
- 04컴포넌트는 OnPush 변경 감지를 사용하며, 코드베이스는 엄격한 TypeScript 모드로 작성되었습니다.
- 05ng-polymorpheus와 Web APIs for Angular를 기반으로 합니다.
활용 사례
- 다양한 기성 UI 컴포넌트가 필요한 Angular 웹 애플리케이션을 구축할 때.
- CSS 변수로 제어하는 사용자 지정 비주얼 테마를 제품 UI에 적용할 때.
- 각 컴포넌트에 맞는 테마 로직을 직접 작성하지 않고 Angular 앱에 다크 모드를 추가할 때.
빠른 시작
- 1
공식 웹사이트에서 Getting started 가이드를 엽니다
- 2
또는 StackBlitz 스타터를 사용해 브라우저에서 샘플을 사용해 봅니다
사용 전 알아둘 점
- Angular 전용 UI 키트이므로 다른 프레임워크에서는 사용할 수 없습니다.
- 현재 v5 계열에는 Angular 19 이상이 필요합니다. 이전 Angular 프로젝트에서는 v4 또는 v3 LTS 계열을 사용해야 합니다.
- Figma 디자인 라이브러리는 버전 2.x와 3.x에서만 사용할 수 있습니다.
포함된 컬렉션
토픽
자주 묻는 질문
- taiga-ui은(는) 무엇인가요?
- 트리 셰이킹 가능한 보조 엔트리 포인트와 CSS 사용자 지정 속성 테마를 갖춘 130개 이상의 컴포넌트와 100개 이상의 디렉티브를 제공하는 Angular UI 키트입니다. Taiga UI는 여러 기본 패키지와 애드온으로 구성된 Angular 컴포넌트 라이브러리입니다. 동적 콘텐츠에는 ng-polymorpheus 접근 방식을 사용하고, 브라우저에 접근할 때는 Web APIs for Angular를 활용합니다.
- taiga-ui은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?
- taiga-ui은(는) Apache-2.0 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.
- taiga-ui은(는) 아직 유지보수되고 있나요?
- 활발히 유지보수 중. taiga-ui의 마지막 커밋은 2026년 11월 6일입니다.
- taiga-ui은(는) 어디에 사용할 수 있나요?
- 다양한 기성 UI 컴포넌트가 필요한 Angular 웹 애플리케이션을 구축할 때. CSS 변수로 제어하는 사용자 지정 비주얼 테마를 제품 UI에 적용할 때. 각 컴포넌트에 맞는 테마 로직을 직접 작성하지 않고 Angular 앱에 다크 모드를 추가할 때.
- taiga-ui는 어떻게 설치하나요?
- 공식 웹사이트에서 Getting started 가이드를 엽니다 또는 StackBlitz 스타터를 사용해 브라우저에서 샘플을 사용해 봅니다
- taiga-ui은(는) 어디서 받을 수 있나요?
- 소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/taiga-family/taiga-ui
요약은 프로젝트 README를 바탕으로 AI가 작성했습니다. GitHub 통계는 매일 갱신됩니다.
관련 프로젝트
설치할 패키지 없이 프로젝트에 복사해 붙여 넣어 쓰는 무료 오픈 소스 Tailwind CSS UI 컴포넌트 모음입니다.
Blazor용 Material Design 컴포넌트 라이브러리로, 전부 C#으로 작성되어 .NET 개발자가 CSS나 JavaScript를 많이 쓰지 않고 웹 UI를 만들 수 있습니다.
Ant Design 디자인 언어를 기반으로 하며 Vue 2와 Vue 3를 지원하는 엔터프라이즈급 Vue UI 컴포넌트 라이브러리입니다.
React 없이 사용할 수 있는 Tailwind CSS 기반 shadcn/ui 스타일의 순수 HTML/CSS/JavaScript 컴포넌트 구현체입니다.
React Aria와 Tailwind CSS v4를 기반으로 한 React UI 컴포넌트 라이브러리로, 이전 이름은 NextUI입니다.