Vortex Platform

모든 개발이 하나로 - 디자이너, 퍼블리셔, 프론트엔드 개발자를 위한 통합 개발 환경

빠른 시작 →

컴포넌트 보기

왜 Vortex인가?

Multi-tenant

Foundation, iCignal(분석), Cals(예약) 3가지 제품 테마 지원

테마브랜딩

Design System

일관된 디자인 토큰과 컴포넌트 시스템

토큰접근성

Developer Experience

TypeScript, Tailwind, shadcn/ui 기반

DX타입

CLI Tool

npx @vortex/cli로 1분 내 설치

CLI자동화

5분 내 시작하기

1. 프로젝트 생성

terminal

npx @vortex/cli init my-project

2. 컴포넌트 추가

terminal

npx @vortex/cli add button input card

3. 사용하기

app.tsx

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

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

15+

컴포넌트

shadcn/ui 기반

제품 테마

Foundation, iCignal, Cals

100%

TypeScript

완벽한 타입 안정성

🎯 Three Product Lines

Vortex는 세 가지 제품 라인을 지원하는 통합 디자인 시스템입니다.

🏗️

Foundation

범용 디자인 시스템으로 모든 프로젝트의 기반이 됩니다.

✅ 깔끔하고 모던한 디자인
✅ 빠른 프로토타이핑에 최적
✅ 27개 핵심 컴포넌트

📊

iCignal

데이터 분석 및 대시보드에 특화된 Analytics 제품

✅ AnalyticsCard 컴포넌트
✅ Blue/Green/Orange 브랜딩
✅ 실시간 모니터링 최적화

📅

Cals

예약 및 스케줄 관리에 특화된 Booking 제품

✅ BookingCard 컴포넌트
✅ Pink/Blue/Purple 브랜딩
✅ 5단계 예약 상태 관리

📖 더 알아보기

🎨 Foundations

디자인 토큰, 색상 시스템, 타이포그래피, 그리드 시스템 등 디자인의 기초를 학습하세요.

Foundations 보기 →

🧩 Components

27개의 완전한 UI 컴포넌트를 탐색하고, 사용 가이드와 Props API를 확인하세요.

Components 보기 →

🔧 Patterns

실전 구현 패턴, Authentication, Form Validation, State Management 등을 학습하세요.

Patterns 보기 →

💡 Examples

실전 프로젝트 예제를 통해 Foundation, iCignal, Cals 활용법을 익히세요.

Examples 보기 →