달레 UI

🎨 달레 스터디의 디자인 시스템

핵심가치 (Core values)

• 모두를 위한 경험 설계 — 초보자부터 전문가까지 쉽게 채택할 수 있는 온보딩 경험
• 명확성과 투명성 — 기술적 개념과 의사결정 과정을 명확하고 투명하게 전달
• 일관성과 신뢰성 — 예측 가능하고 신뢰할 수 있는 컴포넌트와 패턴
• 한국어 사용자 중심 설계 — 한국어 타이포그래피와 문화적 맥락에 최적화
• 적응적 유연성 — 다양한 사용 시나리오에 맞는 유연한 아키텍처
• 커뮤니티 중심 발전 — 오픈소스 정신에 입각한 참여와 기여

문서 (Documentation)

• 스토리북
• 위키

설치 (Installation)

React 프로젝트에서 다음 패키지 매니저 중 하나로 설치합니다.

# with Bun
$ bun add daleui

# with npm
$ npm install daleui

# with pnpm
$ pnpm add daleui

# with Yarn
$ yarn add daleui

앱 진입점(예: main.tsx, App.tsx)에서 스타일을 한 번에 불러옵니다.

import "daleui/styles.css";

사용법 (Usage)

import { Button } from "daleui";

export default () => (
  <>
    <Button size="md" tone="brand" type="button" variant="solid">
      시작하기
    </Button>
    <TextInput placeholder="텍스트를 입력해주세요." />
  </>
);

기여 (Contribution)

본 프로젝트는 All Contributors 관례에 따라 기여자분들의 공헌를 인정하고 감사를 표현하고 있습니다.

응원 (Support)

달레 UI가 여러분의 프로젝트에 도움이 되신다면 후원을 고려해주시면 감사하겠습니다. 💝 저장소에 스타를 주시는 것도 더 많은 분들이 저희 커뮤니티를 찾는데 도움이 됩니다. ⭐