Galaxy UIThư Viện Component Đa Nền Tảng

Bắt Đầu Nhanh ​

# Khởi tạo dự án
npx @galaxy-stack/nebula-cli@latest init

# Thêm components
npx @galaxy-stack/nebula-cli@latest add button input dialog

# Khởi tạo dự án
pnpm dlx @galaxy-stack/nebula-cli@latest init

# Thêm components
pnpm dlx @galaxy-stack/nebula-cli@latest add button input dialog

# Khởi tạo dự án
yarn dlx @galaxy-stack/nebula-cli@latest init

# Thêm components
yarn dlx @galaxy-stack/nebula-cli@latest add button input dialog

# Khởi tạo dự án
bunx @galaxy-stack/nebula-cli@latest init

# Thêm components
bunx @galaxy-stack/nebula-cli@latest add button input dialog

Hỗ Trợ Nền Tảng ​

Web Frameworks ​

<script setup lang="ts">
import { Button } from '@/components/ui/button'
</script>

<template>
  <Button variant="default">Click me</Button>
</template>

import { Button } from "@/components/ui/button"

export default function App() {
  return <Button variant="default">Click me</Button>
}

import { Component } from '@angular/core';
import { ButtonComponent } from '@/components/ui/button';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [ButtonComponent],
  template: `<ui-button variant="default">Click me</ui-button>`
})
export class AppComponent {}

Mobile Platforms ​

import { Button } from '@/components/ui/button'

export default function App() {
  return (
    <Button variant="default">
      <ButtonText>Click me</ButtonText>
    </Button>
  )
}

import 'package:flutter/material.dart';
import 'package:your_app/components/ui/button.dart';

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Button(
      variant: ButtonVariant.defaultVariant,
      onPressed: () {},
      child: Text('Click me'),
    );
  }
}

Tại Sao Chọn Galaxy UI? ​

🎯 Hỗ Trợ Đa Nền Tảng ​

Chọn framework/platform yêu thích của bạn - web hoặc mobile. Chúng tôi hỗ trợ Vue 3, React, Angular, React Native và Flutter với component đẹp giống nhau.

📱 Từ Web Đến Mobile ​

CLI hiện lập chỉ mục 65 mục React, 61 Vue, 60 Angular, 50 React Native và 49 Flutter (component + block). Các catalog có phần lõi chung nhưng chưa đồng bộ tuyệt đối; xem bảng phạm vi.

🔓 Bạn Sở Hữu Code ​

Không giống như npm packages, bạn copy code component trực tiếp vào dự án. Sửa đổi theo nhu cầu. Không xung đột phiên bản.

♿ Ưu Tiên Accessibility ​

Xây dựng trên Radix primitives đã được kiểm nghiệm cho web. Tuân thủ WCAG ngay từ đầu với điều hướng bàn phím và hỗ trợ screen reader.

🎨 Tùy Chỉnh Hoàn Toàn ​

Mọi component sử dụng Tailwind CSS (web) hoặc styling tương đương (mobile). Dễ dàng tùy chỉnh màu sắc, khoảng cách và style để phù hợp với thương hiệu của bạn.

Lấy Cảm Hứng Từ Những Thứ Tốt Nhất ​

Galaxy UI đứng trên vai những người khổng lồ:

• Radix UI - React components không style, accessible
• Radix Vue - Radix primitives cho Vue
• Radix NG - Radix primitives cho Angular
• shadcn/ui - Copy-paste React components
• shadcn-vue - Copy-paste Vue components
• Tailwind CSS - Utility-first CSS framework

Tác Giả ​

Được tạo bởi Bùi Trọng Hiếu (kevinbui)

• GitHub: @buikevin
• Email: kevinbui210191@gmail.com
• Repository: galaxy-nebula/galaxy-design

Giấy Phép ​

MIT © 2025 Bùi Trọng Hiếu (kevinbui)