Chánh Đại
Creating with code. Small details matter.
Overview
Design Engineer @shadcncraft
Founder @Quaric
Social Links
About
- Design Engineer with 5+ years of experience, known for pixel-perfect execution and strong attention to small details.
- Passionate about exploring new technologies and turning ideas into reality through polished, thoughtfully crafted personal projects.
- Creator of chanhdai.com (1.8k stars), React Wheel Picker (24k+ weekly downloads, ▲Vercel OSS Program), and ZaDark (80k+ downloads, 30k+ users) — peak metrics.
Testimonials
awesome. Love the components, especially slide-to-unlock. Great job
CEO @Vercel
You’re doing amazing work.
Creator of shadcn/ui
GitHub Contributions
Stack
TypeScript
JavaScript
Python
PHP
Java
React
Next.js
Tailwind CSS
shadcn/ui
Radix UI
Base UI
Motion
TanStack
MobX-State-Tree
Redux
React Navigation
Node.js
Bun
Laravel
PostgreSQL
MySQL
MongoDB
Redis
Git
Docker
Claude
Cursor
ChatGPT
Figma
PhotoshopComponents[27]
slide to unlock
- 12
- 01
- 02
- 03
- 04
- 05
- 06
- 07
- 08
- 09
- 10
- 11
- 12
- 01
- 59
- 00
- 01
- 02
- 03
- 04
- 05
- 06
- 07
- 08
- 09
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 00
- AM
- PM
<MiddleTruncation>
/Users/ncdai/Code/chanhdai.com/src/components/ui/button.tsx<MiddleTruncation end={4}>
FY26_Q1_Consolidated_Financial_Statements.pdf<MiddleTruncation minEnd={12}>
/Users/ncdai/Code/chanhdai.com/node_modules/shadcn/package.json<MiddleTruncation ellipsis=" ... ">
https://www.apple.com/newsroom/pdfs/fy2026-q1/FY26_Q1_Consolidated_Financial_Statements.pdfI am a Developer
$ pnpm dlx shadcn add button
Hello from Viet Nam 
Built with 
and 
Move your cursor within the text belowPress anywhere within the text below
Processing your request with AI ...
Blog[40]
Followed by @shadcn on X
- Published on
Dot Grid Spotlight
- Published on
Icon Swap
- Published on
Sponsors
Grateful to the sponsors who make this open-source work possible.
Experience
- Work on the registry and React component library.
- Design and build Pro application components and blocks, from Figma to production-ready React.
- TypeScript
- Next.js
- Tailwind CSS
- shadcn/registry
- Figma
- Next.js
- Strapi
- Auth0
- VNPAY-QR
- Docker
- NGINX
- Google Cloud
- Docusaurus
- Extension
- UI/UX Design
- UX Writing
- Design System
- Brand Design
- Figma
- Research
- Business Ownership
- Business Law
- Business Tax
Simplamo
- TypeScript
- Next.js
- React Native
- MobX
- MobX-State-Tree
- Tailwind CSS
- Dify
- Zalo Mini App
- Agile
- Teamwork
- Research
- Problem-solving
- Creativity
- UI/UX Design
- Figma
Tung Tung
- React
- Redux
- Storybook
- Lerna
- Agile
- Teamwork
- Research
- React Native
- Redux
- MoMo Payment API
- App Store
- Google Play Store
- App Center
- Agile
- Teamwork
- Research
- UI/UX Design
- Sketch
Freelance
- Laravel
- React
- Express.js
- Socket.IO
- MongoDB
- Firebase
- WordPress
- Docker
- NGINX
- Creativity
- UI/UX Design
- Graphic Design
- Sketch
- Adobe Photoshop
- Adobe Illustrator
Education
- C++
- Java
- Python
- PHP
- DSA
- Advanced Databases
- Systems Design
- Distributed Systems
- Software Engineering
- Teamwork
- Algorithms
- C++
- PHP
- MySQL
- Laravel
- Node.js
- Pandoc
- Pascal
- NukeViet
- HTML
- CSS
- JavaScript
Projects[12]
iOS-like wheel picker for React with smooth inertia scrolling and infinite loop support. / Backed by ▲Vercel OSS Program
- Natural touch scrolling with smooth inertia, mouse drag and scroll for desktop
- Infinite loop scrolling
- Unstyled core for complete style customization
- Full keyboard navigation and type-ahead search
- Open Source
- React
- TypeScript
- Monorepo
- Turborepo
- pnpm-workspace
- Package Publishing
- NPM Registry
- GitHub Actions
Awards[26]
Certifications[21]
Certificate of Trademark Registration No. 594593
- Issued by
- Intellectual Property Office of Viet Nam
- Issued on
Gemini Certified Educator
- Issued by
- Google for Education
- Issued on
Certificate of Trademark Registration No. 584461
- Issued by
- Intellectual Property Office of Viet Nam
- Issued on
Animations on the Web
- Issued by
- animations.dev
- Issued on
Certificate of Trademark Registration No. 565092
- Issued by
- Intellectual Property Office of Viet Nam
- Issued on
Certificate of Trademark Registration No. 543682
- Issued by
- Intellectual Property Office of Viet Nam
- Issued on
Bookmarks[14]
Agents with Taste
- Author
- Emil Kowalski
- Bookmarked on
Devouring Details
- Author
- Rauno
- Bookmarked on
React handbook
- Author
- Rauno
- Bookmarked on
Train Your Judgement
- Author
- Emil Kowalski
- Bookmarked on
How we think about design
- Author
- Resend
- Bookmarked on
Philosophy
- Author
- Resend
- Bookmarked on
Insights[25.04 – 25.05]
- Unique Visitors
- 13,667
- Sessions
- 16,032
- Views
- 102,814