1. E-Commerce Classic
SHOP.
❤️
🛒3
2. Dashboard Admin
☰
🔔
A
3. Centered Logo
VOGUE
🔍
🛍️
4. Double Decker
Free shipping on orders over $50
Call: +1 234 567 890
BRAND
5. Glassmorphism
AURA.
6. Neumorphism
N
7. SaaS App
⚡
SaaSy
8. Mobile App View
Cài đặt
10. Brutalism
Riot.
11. Split Floating
SP
12. Dark Elegance
✧Luxe
13. Minimal Underline
14. Social Media
SocialApp
❤️
💬
15. Mega Menu Trigger
MARKET.
Sign In
16. Gradient Glow
GLOW
17. Search Focused
W
🔍
18. Typographic
JOURNAL
19. Transparent Overlay
ARCHI.
20. Colorful Bottom Border
CREATIVE
Contact
Glassmorphism Card
🦄
Thẻ trong suốt
Xu hướng thiết kế mờ ảo giúp giao diện có chiều sâu và sang trọng hơn.
Nút bấm (Glass Button)
Ô nhập (Glass Input)
Thẻ Visa (Glass Card)
💳
VISA
**** **** **** 1234
Nguyen Van A
12/28
Hồ sơ (Glass Profile)
Alex Johnson
Photographer
Thời tiết (Glass Weather)
Hà Nội
28°
Trời nắng nhẹ
⛅
Máy nghe nhạc (Glass Player)
🎧
Midnight City
M83
Thống kê (Glass Stat)
📈
+15%
Lượt truy cập
12,450
Menu nổi (Glass Tab)
Thông báo (Glass Alert)
🔔
Cập nhật hệ thống
Phiên bản mới đã sẵn sàng để cài đặt.
Bảng giá (Glass Pricing)
Gói Pro
$29/mo
Công tắc (Glass Toggle)
Dark Mode
Tìm kiếm (Glass Search)
🔍
Tiến trình (Glass Progress)
Đang tải...60%
Mã giảm giá (Glass Coupon)
50%
OFF
Black Friday
Code: KEMCODE50
Sản phẩm (Glass Product)
👟
Giày Sneaker Glass
$89.00
Ví tiền (Glass Wallet)
₿
+2.5%
Bitcoin (BTC)
1.2450
≈ $82,450.00
Ngày tháng (Glass Date)
Tháng 10
24
Thứ Sáu
Nhãn nổi (Glass Badge)
🚀 Sắp ra mắt
✨ Mới
Biểu đồ (Glass Chart)
Thống kê tuần
Input & Toggle mượt mà
Bật thông báo
Upload Kéo Thả
☁️
Kéo thả file vào đây
Hỗ trợ PNG, JPG (Max 2MB)
Nhập mã OTP
Mật khẩu (Ẩn/Hiện)
Tìm kiếm (Search Bar)
🔍
Tăng/Giảm (Stepper)
Hộp chọn (Select Dropdown)
▼
Khung văn bản (Textarea)
0/250 ký tự
Hộp kiểm (Checkbox)
Chọn một (Radio)
Thanh kéo (Range Slider)
$0
$500
$1000
Chọn Ngày (Date)
Chọn Màu (Color)
#EC4899
Gắn thẻ (Tags Input)
React
VueJS
Thẻ Tín Dụng (Credit Card)
💳
URL Prefix (Tiền tố)
https://
Tiền tệ (Currency)
VNĐ
Hợp lệ (Success State)
✓
Tên đăng nhập hợp lệ!
Báo lỗi (Error State)
!
Email không đúng định dạng.
Cyberpunk Input
Nổi khối (Neumorphism)
Nút đính kèm (File Button)
Chưa có tệp nào được chọn.
Glassmorphism (Kính)
Viền Động (Gradient Border)
Nhãn bay (Floating Label)
Gạch đáy động (Animated Line)
Có Icon Trái (Left Icon)
Mật khẩu (Password Toggle)
Nhập mã OTP (Code)
Báo lỗi (Validation Error)
Email không đúng định dạng.
Neumorphism Lõm
@
Kính mờ (Glassmorphism)
Cyberpunk Glitch
INPUT
Cổ điển (Brutalism)
Thanh Tìm Kiếm (Search)
Tiền tệ (Currency Prefix)
VNĐ
Vùng nhập lớn (Textarea)
0 / 250
Tải tệp (File Upload)
Chọn màu (Color Picker)
Chọn nhiều (Multi-Select)
Đã chọn 2 kỹ năng
▼
Nút Xóa (Clearable)
Nhập thẻ (Tags Input)
UI/UX
Design
Nét đứt (Dashed Underline)
Ký tên:
Khối chọn (Block Radio)
Trạng thái Tải (Loaders)
Cột sóng (Sound Wave)
Sóng Radar (Ping)
Vòng xoay kép (Dual Spin)
Chấm nảy (Bouncing Dots)
Gợn sóng (Ping Ripple)
Đường chạy vô tận (Line)
Loading Data...
Quỹ đạo (Orbit Spin)
Nhịp tim (Heartbeat)
❤️
Quét Radar (Sweep)
Chữ đang gõ (Typing)
Loading...
Đồng hồ cát (Hourglass)
⏳
Neumorphism Spinner
Khung xương (Skeleton)
Khối vuông lật (Flip)
Lưới xoay (Grid Spin)
Đang sạc (Battery)
Lục giác Cyberpunk
Kính mờ (Glass Spinner)
Chuỗi nảy (Square Chase)
Đa giác lật (Polygon Spin)
Thanh kéo dãn (Stretching Bar)
Hành tinh (Planet)
Thẻ lật 3D
🃏
Rê chuột vào đây!
KEMCode
Hiệu ứng lật 3D siêu mượt bằng CSS thuần không cần Javascript.
Product Card
-20%
👟
Sneaker Air Max
990.000đ
Hồ Sơ (Profile)
Nguyễn Văn A
Senior Web Developer
Vé Sự Kiện (Ticket)
24
Tháng 12
KEMCode Offline
19:00 - Landmark 81, TP.HCM
Thẻ Credit Card (Glass)
💳
VISA
**** **** **** 8888
KEMCode
12/28
NFT Crypto Card
12h 43m left
Neon Cyber Punk
Current Bid
2.45 ETH
Job Posting Card
G
2 ngày trước
Senior Frontend Dev
Google Inc. • Remote
ReactJS
Tailwind
$120k - $150k
Recipe Card
❤️
Healthy
⭐ 4.8
Salad bơ cá hồi
⏱️ 15 Phút
🔥 320 kcal
Course Progress
Master UI/UX Design
12 / 24 Bài học
Tiến độ50%
Podcast Audio
Tập 24
Lập trình không khó
KEMCode Talk
Real Estate
ĐANG BÁN
3.2 Tỷ
Biệt thự Vinhomes Central Park
Bình Thạnh, Hồ Chí Minh
🛏️ 3
🛁 2
📐 120m²
Metric Statistic
💰
↑ 12.5%
Tổng doanh thu
$45,231.00
Cover Profile Card
Anna Bella
@annadesign • UX Designer
Minimal Article
THIẾT KẾ
Bí quyết làm chủ Tailwind CSS trong 1 tuần
Tailwind đang là framework CSS phổ biến nhất hiện nay, giúp bạn code giao diện nhanh gấp 3 lần...
Đọc tiếp →
Travel Destination
🤍
Phố cổ Hội An
📍 Quảng Nam, VN
950k /đêm
Service Feature
🚀
Tối ưu tốc độ
Website load siêu tốc dưới 1s, giúp tăng tỷ lệ chuyển đổi và điểm SEO.
Cart Item Card
🎧
Tai nghe AirPods Max
Màu: Space Gray
$549.00
1
Movie Poster
INTERSTELLAR
Sci-Fi, Drama
IMDb 8.6
Polaroid Photo
Kỷ niệm team building!
Wallet Balance
Số dư khả dụng
$12,450.00
👁️
Notification Card
🔔
Hệ thống nâng cấp
Quá trình bảo trì sẽ diễn ra vào lúc 02:00 sáng mai.
Vừa xongCyberpunk Card
SYSTEM
ID:992Status: Online
Neumorphism Card
💧
Soft Design
Giao diện nổi khối mang lại cảm giác dễ chịu, chân thực.
Hover Reveal Overlay
Developer Workspace
Góc làm việc chuẩn chỉ giúp tăng 200% năng suất code mỗi ngày.
Progress Card
Dự án Alpha
Đang hoàn thiện
12 Task còn lại75%
Hồ sơ (Profile)
Alex Johnson
UI/UX Designer @KEMCode
Đam mê sáng tạo giao diện và trải nghiệm người dùng tối ưu.
Sản phẩm (E-commerce)
HOT
Giày Nike Air Max
Giày chạy bộ nam
$120
Bài viết (Blog Post)
Công nghệ
Bởi Admin • 2 ngày trước
Tương lai của Frontend Web Development năm 2026
Thẻ ngân hàng (Visa)
**** **** **** 8888
Card Holder
NGUYEN VAN A
Expires
12/28
Kính mờ (Glassmorphism)
🔮
Giao diện tương lai
Xu hướng thiết kế mờ ảo đang thống trị các ứng dụng hiện đại.
Neumorphism
☁️
Cảm giác vật lý
Giao diện mềm mại, nổi bật nhờ kỹ thuật đổ bóng CSS tinh tế.
Cyberpunk
SYS_01
> Database
Truy cập dữ liệu mạng lưới bị gián đoạn. Yêu cầu mã hóa.
Vé sự kiện (Ticket)
Frontend Meetup
DevFest 2026
📅 24 Th10, 08:00 AM
ADMIT ONE
Trình phát nhạc (Audio)
Midnight City
Synthwave
Bất động sản (Property)
★ 4.8
$850,000
Biệt thự ven biển
🛏️ 4 Phòng
🛁 3 Tắm
📐 250m²
Món ăn (Recipe)
Pizza Margherita Ý
⏱ 30 Phút
🔥 350 Kcal
NFT / Crypto
12h : 45m : 30s
Abstract #042
0.85 ETHBid cao nhất: @crypto_king
Khóa học (E-Learning)
⚛️
ReactJS Masterclass 2026
Bài 12: Context API
60%8/15 Bài
Tuyển dụng (Job Post)
G
Senior Frontend
Google Inc. • Remote
Full-time
$3K - $5K
Cổ điển (Brutalism)
TIN TỨC
THIẾT KẾ ĐỘC LẠ
Phong cách Brutalism đang dần quay trở lại và phá vỡ mọi quy tắc.
Kanban Task
High Priority
⋮
Sửa lỗi giao diện trang thanh toán di động
📅 24 Th10
Lật 3D (Hover Flip)
Poster Phim (Netflix)
INTERSTELLAR
98% Match • 2014
Một hành trình vượt ra ngoài dải ngân hà để cứu rỗi nhân loại.
Thông báo (Activity)
🎉
Bạn vừa nhận được một phần quà từ hệ thống!
2 phút trước
Ứng dụng (App Store)
K
KEMCode App
Công cụ UI/UX
★★★★★ (12k)
Hiệu ứng Text
Chữ Gradient Động
Viền Nổi Neon
Máy Đánh Chữ
KEMCode is Awesome!
Chữ Glitch Cyberpunk
CYBER CYBER CYBER
Chữ nền Hình ảnh
CREATIVE
Chữ khối 3D (Retro)
RETRO
Phát sáng (Neon Glow)
NIGHT CITY
Gạch chân (Hover Line)
Hover vào tôi!
Dạ quang (Highlight)
Đây là một đoạn văn có chứa
từ khóa quan trọng
được đánh dấu.
Bí mật (Blur Reveal)
TOP SECRET
Gạch sóng (Wavy Line)
Lướt sóng cùng tôi
Viền thành khối (Outline)
Fill Me In
Lơ lửng (Floating)
Gravity? 🎈
Giãn cách chữ (Spacing)
Expand Horizon
Chữ to đầu dòng (Drop Cap)
M ột thiết kế đẹp không chỉ nằm ở vẻ bề ngoài mà còn ở cách nó hoạt động. Sự kết hợp giữa Typography và khoảng trắng tạo nên nhịp điệu hoàn hảo cho văn bản, giúp người đọc dễ dàng tiếp thu thông tin.
Neumorphism Text
SOFT UI
Bóng gương (Reflection)
Echo
Echo
Xóa ngang (Strikethrough)
Giá cũ: $99
Đèn rọi (Spotlight Blend)
MAGIC
Chữ dọc (Vertical)
NHẬT
BẢN
Rung lắc (Error Shake)
⚠️ Sai mật khẩu!
Bóng Gradient (Shadow)
AWESOME
AWESOME
Trượt mở (Box Reveal)
SURPRISE!
Nghiêng 3D (Perspective)
STAR WARS
Cầu vồng (Rainbow)
PRIDE MONTH
Tương tác nhỏ (Micro UI)
Reaction MXH
Menu Hamburger
Click vào nút để xem hiệu ứng
Lưu trữ (Bookmark)
Tải xuống (Download)
Cài đặt (Gear Spin)
Thùng rác (Trash Lid)
Gửi (Send Plane)
Khóa (Unlock)
Sao chép (Copy)
Làm mới (Refresh)
Ẩn/Hiện (Eye Slash)
Giỏ hàng (Cart Pop)
Wifi Signal
Nút nguồn (Power)
Microphone Mute
Âm lượng (Volume)
Vân tay (Fingerprint)
👆
Chạm (Tap Ripple)
Xoay mở (Plus to X)
Mở rộng (Chevron)
Ngôi sao (Star Pop)
Gợi ý vuốt (Swipe)
👈
Vuốt ngang
Neumorphism (Soft UI)
Ô tìm kiếm (Input)
🔍
Công tắc (Toggle)
Thanh trượt (Slider)
Hộp kiểm (Checkbox)
Hồ sơ (Profile Card)
Steve Job
Designer
Máy nghe nhạc (Player)
Mạng xã hội (Social)
Máy tính (Calculator)
Chuyển Tab (Tabs)
Vòng tiến trình (Circle)
75%
Phân trang (Pagination)
Vùng nhập (Textarea)
Nút xoay (Knob)
Cảnh báo (Alert Box)
!
Lỗi kết nối mạng.
Ngày (Date Badge)
Mar
24
Các bước (Stepper)
1
2
3
Nút xổ xuống (Dropdown)
Thời tiết (Weather)
TP.HCM
32°C
☀️
Đồng hồ (Analog Dial)
Nút kêu gọi (Hero CTA)
Lưới Skeleton Grid
Hồ sơ (Profile)
Bài viết (Article)
Sản phẩm (Product)
Danh sách (List)
Biểu đồ (Chart)
Video Box
Tin nhắn (Chat)
Bảng giá (Pricing)
Giỏ hàng (Cart Item)
Lưới Ảnh (Gallery)
Form Nhập liệu
Widget Thống kê
Bảng dữ liệu (Table)
Lịch (Calendar)
Đánh giá (Review)
Bài đăng (Social Post)
Máy nghe nhạc (Audio)
Thông báo (Notification)
Bình luận (Comments)
Quét Sáng (Shimmer Sweep)
Hiệu ứng Ảnh (Hover Reveal)
XEM THÊM →
Hover Zoom Image
Lập trình Web
Tối ưu UI/UX mượt mà
Lưới ảnh (Bento Grid)
Lồng màu (Duotone)
Mở rộng tròn (Circle Reveal)
Hover me!
Nhãn dán nổi (Floating Tags)
HOT
⭐ 4.9
Polaroid Stack
Memory #1
Bóng phản chiếu (Reflection)
Mở khóa ảnh (Blur Reveal)
Nhấn để xem
Cắt vát chéo (Diagonal)
New
Quét Radar (Cyberpunk)
Khung đổ bóng (Shadow Frame)
Kính lúp (Magnifier)
Nghiêng 3D (3D Perspective)
Trượt nội dung (Slide Caption)
Workspace 2026
Cảm hứng góc làm việc tối giản.
Xếp chồng rời (Offset Stack)
Viền đứt đoạn động (SVG Line)
Tập trung (Focus Highlight)
Tech Board
Vòm khuyết (Arch Mask)
Ảnh ghim tường (Pinned Board)
Bài đăng MXH (Social Post)
❤️
Viền sáng động (Glow Border)
Thông báo nổi (Toast Notification)
Thành công!
Dữ liệu đã được lưu an toàn.
Toast Success
Rê chuột vào khung 👉
✓
Cập nhật thành công
Dữ liệu đã được lưu lên máy chủ an toàn.
Lỗi (Error)
Rê chuột vào khung 👉
!
Xóa thất bại
Không thể xóa file hệ thống.
Cảnh báo (Warning)
Rê chuột vào khung 👉
⚠️
Sắp hết dung lượng
Bạn đã dùng 95% dung lượng lưu trữ. Hãy nâng cấp gói.
Tin nhắn (Message)
Rê chuột vào khung 👉
Anna Bella
Đã gửi cho bạn một tệp đính kèm.
Hoàn tác (Undo)
Rê chuột vào khung 👉
Đã chuyển email vào Thùng rác.
Kính mờ (Glassmorphism)
Rê chuột vào khung 👉
✨
Giao diện cập nhật
Glassmorphism đã được bật.
Neumorphism
Rê chuột vào khung 👉
i
Đã lưu cấu hình Soft UI.
Cyberpunk Tech
Rê chuột vào khung 👉
> UPLOAD_COMPLETE
100%
Cổ điển (Brutalism)
Rê chuột vào khung 👉
💾
SAVED
File has been saved.
Trượt từ trên xuống
Rê chuột vào khung 👆
Đã kết nối với máy chủ.
Tối giản (Pill)
Rê chuột vào khung 👇
✔
Đã copy vào bộ nhớ tạm
Mở khóa thành tựu
Rê chuột vào khung 👉
🏆
Thành tựu mới
Chiến thần Code
Đang tải file (Progress)
Rê chuột vào khung 👉
📥 KEMCode_UI.zip
75%Cuộc gọi đến
Rê chuột vào khung 👆
Mẹ yêu
Cuộc gọi video đến...
Xếp chồng (Stacked)
Rê chuột vào khung 👇
🔔
Bạn có 3 thông báo mới.
Bóng sáng (Glow Shadow)
Rê chuột vào khung 👉
✨
Tính năng Premium
Đã kích hoạt thành công.
Nét đứt (Dashed Outline)
Rê chuột vào khung 👉
!
Lưu ý quan trọng
Dự án chưa được lưu bản nháp.
Viền Động (Gradient)
Rê chuột vào khung 👉
PRO
Chào mừng VIP!
Tận hưởng kho tính năng vô hạn.
Đã lưu Bookmark
Rê chuột vào khung 👉
📁
Đã lưu vào UI Design
Vuốt để tắt (Swipe)
Rê chuột và Nhấn giữ 👇
Kéo tôi sang phải để tắt 👉
Accordion (Trình đơn xếp)
Câu hỏi thường gặp 1? ⬇️
Đây là nội dung được xổ xuống một cách mượt mà.
Hỏi đáp mượt (FAQ)
Làm sao để đặt hàng? +
Bạn chỉ cần thao tác chọn cấu hình ở Bước 1 và 2. Hệ thống sẽ tự động tính giá live cho bạn nhé!
Tối giản (Minimalist)
Thông tin bản quyền?
Sản phẩm thuộc bản quyền của KEMCode, cấm sao chép dưới mọi hình thức.
Thẻ nổi (Floating)
Lợi ích khi nâng cấp VIP?
Bạn sẽ được truy cập toàn bộ source code và nhận hỗ trợ 24/7 từ đội ngũ dev.
Viền dọc (Left Accent)
💡 Cập nhật tính năng mới
Phiên bản 2.0 đã ra mắt với hơn 60 component UI cực xịn xò.
Nền Gradient
Tính năng siêu việt! ▼
Thiết kế cực chất, thu hút mọi ánh nhìn ngay từ giây đầu tiên.
Menu lồng nhau (Nested)
▶ Tài liệu API
1. Giới thiệu
▶ 2. Authentication
Sử dụng Bearer Token để xác thực.
Nút Cộng/Trừ (Plus/Minus)
Refund Policy?
Chúng tôi hỗ trợ hoàn tiền 100% trong vòng 7 ngày nếu bạn không hài lòng về chất lượng code.
Ảnh nền (Image Banner)
Giao diện Dark Mode ↓
Toàn bộ component đều được hỗ trợ giao diện tối (Dark Mode) chuẩn chỉ, chuyển đổi mượt mà không độ trễ.
Glassmorphism Style
Thiết kế Kính mờ ✨
Tạo cảm giác chiều sâu không gian, phù hợp cho các thiết kế hiện đại mang hơi hướng Apple.
Neumorphism
Bảo mật dữ liệu ▼
Công nghệ mã hóa AES-256 an toàn tuyệt đối.
Hồ sơ trượt (User Card)
Admin KEMCode
Super Administrator
⚙️
Admin KEMCode
Super Administrator
Tooltip (Gợi ý nổi)
Xin chào, mình là Tooltip! ✌️
Tooltip Trên (Top)
Tooltip hiện ở trên 👆
Tooltip Dưới (Bottom)
Tooltip hiện ở dưới 👇
Tooltip Trái (Left)
Bên trái 👈
Tooltip Phải (Right)
👉 Bên phải
Kính mờ (Glassmorphism)
Giao diện trong suốt 🪟
Nổi khối (Neumorphism)
Thông tin chi tiết ẩn giấu.
Cyberpunk
> SYS_REVEALED
Phát sáng (Gradient Glow)
Đẹp lung linh ✨
Kèm Icon (Rich Info)
💡
Mẹo hay
Bạn có thể sử dụng phím tắt Ctrl + K để mở nhanh menu tìm kiếm.
Hồ sơ (Profile Card)
Alex Johnson
@alex_dev
12k Flw
Xem ảnh (Image Preview)
Xem bản vẽ thiết kế
Bản thảo Wireframe V2.1
Biểu đồ Mini (Mini Chart)
Doanh thu ↗
Tuần qua
Báo lỗi (Error Alert)
!
Mật khẩu phải có ký tự in hoa.
Lật 3D (3D Flip)
Bất ngờ chưa? 🎁
Cổ điển (Brutalism)
CLICK TO READ MORE
Phím tắt (Shortcut)
Tìm kiếm
Ctrl
K
Tương tác (Action Popover)
Trạng thái (Status Dot)
Server 1
Hoạt động ổn định
Bảng giá Mini (Pricing)
Gói Doanh Nghiệp
Enterprise
$99/mo
Không giới hạn tính năng. SLA 99.9%.
Trượt nở ngang (Stretch Expand)
👋
Xin chào bạn!
Tabs (Thẻ chuyển đổi)
Nội dung của Tab 1. Rất mượt!
Gạch dưới (Underline)
Nội dung tab tổng quan sẽ hiển thị ở đây.
Segmented (iOS Style)
Tab Dọc (Vertical)
Chỉnh sửa thông tin hồ sơ của bạn.
Thư mục (Folder)
Đây là ngăn chứa tài liệu quan trọng.
Neumorphism
Glassmorphism
Cyberpunk
Icon (Tooltip)
Tối giản (Minimalist)
Bong bóng (Bubble Arrow)
Tùy chỉnh giao diện theo ý thích.
Cổ điển (Brutalism)
Glow Underline
Thẻ rời (Detached Pills)
Dấu chấm (Dot Tabs)
Kết nối dọc (Vertical Line)
Emoji Tabs
Khối màu (Solid Color)
Cắt vát (Angled Tabs)
Khung kết nối (Outline)
Bảng điều khiển (Dashboard)
Progress Bar
Đang tải dữ liệu...
45%
Vòng tròn phần trăm
75%
Gradient Progress
Đang cài đặt...
70%
Sọc chuyển động (Striped)
Uploading...60%
Phân mảnh (Segmented)
Hoàn thiện hồ sơ3/5 Bước
Nhãn nổi (Floating Label)
75%
Mức Pin (Battery)
Chiều dọc (Vertical)
Xếp chồng (Stacked)
Bộ nhớ: 64GB / 128GB
SYS
APP
IMG
Nổi khối (Neumorphism)
Đang xử lý...
Kính mờ (Glassmorphism)
Loading...85%
Cyberpunk / Neon
> System_Load[ 68% ]
Độ mạnh mật khẩu
Mật khẩu mạnh
Đồng hồ bán nguyệt (Gauge)
60%
Tải lên tệp tin (Upload)
📄
Design_Mockup.fig
4.2 MB / 10 MB
Siêu mỏng (Thin Line)
Dung lượng
82%
Kỹ năng (Skill Bars)
HTML
CSS
JS
Dạng chấm (Dotted)
Mức độ tương tác
Dạ quang (Neon)
SYNCHRONIZING88%
Nối điểm (Stepped Nodes)
Tooltip đính kèm
65%
Cổ điển (Brutalism)
LOADING
90%
Trạng thái text (Text Steps)
Giỏ hàng
Thanh toán
Hoàn tất
Modal (Cửa sổ Pop-up)
Cảnh báo!
Đây là nội dung popup.
Cookie Consent
Rê chuột vào khung này 👇
🍪
Dùng Cookie
Để tối ưu trải nghiệm web.
Thành công (Success)
Rê chuột vào đây
✓
Tuyệt vời!
Giao dịch của bạn đã hoàn tất.
Xác nhận xóa (Delete)
Rê chuột vào đây
🗑️
Xóa dữ liệu?
Hành động này không thể hoàn tác. Bạn chắc chắn chứ?
Nhận bản tin (Newsletter)
Rê chuột vào đây
💌
Nhận code VIP mỗi tuần!
Tham gia cùng 10.000+ developer khác.
Khuyến mãi (Promo)
Rê chuột vào đây
50% OFF
Flash Sale
Kết thúc trong 02:45:10
Đăng nhập (Login)
Rê chuột vào đây
Đăng nhập
Quên mật khẩu?
Đánh giá (Rating)
Rê chuột vào đây
Bạn thấy app thế nào?
Vui lòng đánh giá để chúng tôi cải thiện.
★
★
★
★
★
Tìm kiếm (Spotlight)
Rê chuột vào đây
🔍
ESC
Gần đây
📄 Hướng dẫn API
⚙️ Cài đặt hệ thống
Nâng cấp (Upgrade Pro)
Rê chuột vào đây
Pro Plan
$9.99/tháng
- ✔️ Tải không giới hạn
- ✔️ Hỗ trợ 24/7 ưu tiên
- ✔️ Không có quảng cáo
Chia sẻ (Share)
Rê chuột vào đây
Chia sẻ liên kết
f
Facebook
t
Twitter
in
Instagram
🔗
Copy
Trượt lên (Bottom Sheet)
Rê chuột vào đây
Tùy chọn nội dung
Trượt cạnh (Side Drawer)
Rê chuột vào đây
Giỏ hàng (2)
👟
Sneaker Air
$120.00
Glassmorphism Modal
Rê chuột vào đây
Giao diện trong suốt
Mang lại cảm giác chiều sâu và hiện đại hệt như macOS.
Neumorphism Pop-up
Hover me
Soft UI Layout
Cyberpunk Glitch
HOVER_SYS
WARNING
System Breach
> Unidentified access detected.
Tải tệp lên (Upload)
Rê chuột vào đây
Tải tài liệu
☁️
Kéo thả file vào đây
Xác thực OTP (2FA)
Rê chuột vào đây
🔒
Nhập mã OTP
Mã gồm 4 chữ số đã gửi tới số đuôi ***88
8
6
Phần thưởng (Reward)
Rê chuột vào đây
✨
✨
🎁
Chúc mừng!
Bạn nhận được 100 Điểm KEM
Góp ý (Feedback)
Rê chuột vào đây
💡 Góp ý tính năng
Phản hồi của bạn giúp UI Lab tốt hơn.
Hết phiên (Timeout)
Rê chuột vào đây
⏳
Hết phiên làm việc
Vì lý do bảo mật, tài khoản sẽ tự động đăng xuất sau 59s.
Kèm Icon (Icon Menu)
Hồ sơ (User Profile)
Thông báo (Notifications)
Thông báo (2)
Đánh dấu đã đọc
Phân cấp (Nested)
- Sản phẩm nổi bật
-
Thiết bị điện tử ▶
- Điện thoại
- Laptop
- Liên hệ
Mega Menu (Lớn)
Thiết kế
- UI/UX Website
- Mobile App
- Branding
Lập trình
- Frontend Dev
- Backend API
- Database
Chọn màu (Color Picker)
Chọn chủ đề
Tìm kiếm (Searchable)
- 🇻🇳 Việt Nam
- 🇺🇸 Hoa Kỳ
- 🇯🇵 Nhật Bản
- 🇰🇷 Hàn Quốc
Giỏ hàng (Mini Cart)
Giỏ hàng của bạn
👟
Sneaker Pro
1 x $120
👕
Áo thun basic
2 x $25
Tổng:$170.00
Dấu 3 chấm (Context Menu)
Glassmorphism Menu
Neumorphism Dropdown
Cyberpunk Menu
Tích chọn (Checkmarks)
- Mới nhất ✓
- Giá thấp đến cao
- Giá cao đến thấp
Ngôn ngữ (Language)
Mở ngược lên (Dropup)
Trượt ngang (Slide In)
Điều hướng
- Trang chủ
- Sản phẩm
- Bài viết
Viền Động (Gradient)
Tối giản (Minimalist)
Badges & Chips
Primary
Online
Lỗi (Error)
Premium 👑
Badge Thông báo App
99+
Trạng thái (Status)
Hoàn thành
Đang xử lý
Lỗi
Có nút Xóa (Dismissible)
Lập trình Web
UI/UX
Viền Neon (Neon Glow)
CYBERPUNK
Kèm Icon (With Icon)
Top Đánh Giá
Bảo mật
Số đếm nổi (Counters)
Hộp thư
5
Cài đặt
Neumorphism Badge
Soft Design UI
Kích thước (Sizes)
Nhỏ (Small)
Vừa (Medium)
Lớn (Large)
Cắt góc (Cyberpunk)
System_Ready
Nhãn góc (Ribbon)
GIẢM 50%
Khung sản phẩm
Viền Động (Animated)
PRO MEMBER
Avatar Group
Trạng thái Online
Gradient Ring (Story)
Avatar Ký tự (Initials)
K
E
M
Bo góc (Rounded Square)
Chỉnh sửa (Upload)
📷
Đã xác minh (Verified)
Hồ sơ mini (Mini Profile)
Tony Stark
@ironman
Gợi ý tên (Tooltip)
Peter Parker
Thêm mới (Add New)
Nổi 3D (Floating)
Có thông báo (Badge)
Lục giác (Hexagon)
Viền xoay (Spin Ring)
Cặp đôi (Duo Pair)
Gaming Level
Neumorphism
Glassmorphism
Cyberpunk
Cổ điển (Brutalism)
Xòe bài (Fan Out)
Bong bóng (Speech)
Đang code dở... 💻
Chuyển màu (Hover Color)
Quốc tịch (Country Flag)
Làm mờ (Spoiler Blur)
18+
Video Profile
▶
Bóng lệch (Offset Shadow)
Chuyển hình dạng (Shape)
Băng keo (Scrapbook)
Đa trạng thái (Status)
Thẻ tên trượt (Slide Tag)
CEO KEMCode
HOT
Bảng giá (Pricing)
Gói Doanh Nghiệp
999k /tháng
- ✔️ Băng thông không giới hạn
- ✔️ Hỗ trợ 24/7
Phổ biến
Gói Pro
Dành cho cá nhân chuyên nghiệp
$19/tháng
- ✔ 5 Project
- ✔ 50GB Dung lượng
- ✔ Hỗ trợ ưu tiên
Cơ bản
Miễn phí
- 1 User
- Tính năng cơ bản
- Hỗ trợ cộng đồng
Doanh nghiệp
Trả theo số lượng nhân sự
$49/tháng
1 User50 Users
Mua 1 lần
Lifetime Deal
$199
$499
Hoặc trả góp:
$19/tháng x 12 tháng
Standard
$12/mo
Starter
$5
- ✔️ 1 Website
- ✔️ 10GB Băng thông
- ❌ Tên miền riêng
- ❌ Xóa Logo KEMCode
Glass Tier
$29
- ✨ Giao diện siêu thực
- ✨ Blur không giới hạn
- ✨ Gradient Animation
Soft Plan
$15
- Nổi khối mượt mà
- Không mỏi mắt
VIP_ACCESS
> Hacker_Tier
2099¢
- > Unlimited_Bypass
- > Neural_Link: Active
- > Firewall_Breach: 100%
Agency
$99
- ✔️ Không giới hạn User
- ✔️ API Access
- ✔️ White-label
Exclusive
$150
- ◇ Giao diện đen tuyền
- ◇ Trải nghiệm sang trọng
Day Pass
$9
Sử dụng toàn bộ công cụ trong 24h.
Ultimate
$89
- ✦ All Features
- ✦ Priority Support
Team
$39
Xem 15+ tính năng ▼
- - Admin Dashboard
- - Phân quyền User
- - Export PDF/Excel
- - Custom Domain
- - API Webhook
Tùy chỉnh
$5 / user / tháng
10 Users
Tổng cộng:
$50
Developer
$29
Gói tốt nhất cho dân dev tự do.
Doanh nghiệp
$199
- • SLA 99.9%
- • Quản lý Account riêng
- • Server ảo hóa biệt lập
Giảm 20%
Creative
$15
- ☛ 100+ Template
- ☛ Figma Files
- ☛ Free Updates
🌱
Gói Khởi Đầu
$0
Dùng thử vĩnh viễn với các tính năng cơ bản nhất.
Dòng thời gian (Timeline)
-
Ra mắt phiên bản 1.0
-
Cập nhật ứng dụng PWA
Nằm ngang (Horizontal)
Q1 2026
Q2 2026
Q3 2026
Đơn hàng (Order Track)
🛒
Đã đặt hàng
12:30 PM, 24/10/2026
🚚
Đang giao hàng
Dự kiến giao: Hôm nay
Nhật ký (Activity Log)
Anna đã bình luận trên Task #124
10 phút trướcHuy đã đẩy code lên main
2 giờ trướcHình đại diện (Avatars)
Sarah
Bản thiết kế này rất đẹp!
Mike
Tôi đã cập nhật file Figma.
Zigzag Trái/Phải
Khởi động
Jan 2026
Phát hành
Mar 2026
Dạng Thẻ (Card UI)
Update
Phiên bản 2.0
Cải thiện hiệu năng và UI.
Nét đứt (Dashed Line)
-
Chuẩn bị dữ liệu
-
Xử lý thuật toán
Lịch Khối (Date Block)
Th10
24
Hội thảo Tech
TP. Hồ Chí Minh
Tiến độ chạy màu
Nộp đơn
Phỏng vấn
Đa màu sắc (Multi-Color)
Lỗi nghiêm trọng
Cảnh báo server
Khôi phục thành công
Neumorphism
2026
Glassmorphism
Design Phase
Cyberpunk
> SYS_UPDATE
V_2.0.4 Installed.
Cổ điển (Brutalism)
START
Mở rộng (Reveal)
Xem chi tiết bản cập nhật ▼
Đã thêm 20 component mới vào thư viện UI Lab.
Nhãn Gradient
Ra mắt MVP
HOTTrượt Hover (Slide Dot)
Mốc 1
Mốc 2
Kèm Hình ảnh (Thumbnails)
Thiết kế UI
Hoàn thành trang chủ
Tối giản (Minimalist)
09:00
Daily Standup Meeting
10:30
Review Code
Báo động Pulse
Deadline sắp tới!
Còn 2 giờ nữa.
Bo tròn (Pills)
Dấu chấm (Dots)
Tải thêm (Load More)
Viền mỏng (Outline)
Nhập số (Jump to Page)
Trang
/ 24
Chỉ mũi tên (Arrows)
1 của 10
Gradient Active
...
Kính mờ (Glassmorphism)
Cyberpunk Style
Tiến trình (Progress)
Trang 3
Trang 10
Neumorphism
Dropdown (Select Box)
Cổ điển (Brutalism)
Gạch dưới (Underline)
Thanh trượt (Slider)
2
110
Kèm Thông tin (Info)
Đang hiển thị 11-20 trên 150 kết quả
Khối lớn (Big Blocks)
Trượt thu phóng (Scale)
Tối giản (Hover Line)
Cuộn tự động (Infinite)
Cuộn để tải thêm
Trục dọc (Vertical)
Khối dính liền (Compact)
Retro Win95
Phím cơ (Mechanical)
Hình thoi (Diamonds)
Trải rộng (Hover Expand)
Xem trước (Thumbnail)
Chữ viết (Spelled Out)
Kèm bộ lọc (Per-page)
Hiển thị:
/ trang
Biểu tượng (Icons Only)
5
Phân số (Typography)
04
/
12
Gạch ngang (Dashes)
Vòng tròn (Rings)
Viền Neon (Glow)
Dòng lệnh (Terminal)
Thẻ trôi (Floating)
Thư mục (Folder)
Dây kết nối (Nodes)
Cuộn trang (Scrollspy)
Emoji Vui Nhộn
Trang Chuối
Khung trượt (Carousel)
Chạy tự động (Marquee)
Logo 1
Logo 2
Logo 3
Logo 4
Logo 1
Logo 2
Logo 3
Logo 4
Vuốt dọc (Vertical Snap)
Có nút chuyển (Arrows)
Dấu chấm (Dots Indicator)
Thư viện ảnh (Gallery)
Stories (Mạng xã hội)
Sản phẩm (E-commerce)
Đánh giá (Testimonial)
Hero Banner Slider
Căn giữa (Center Focus)
Coverflow (Xếp chồng)
Neumorphism Carousel
Glassmorphism
Cyberpunk Slider
Cổ điển (Brutalism)
Netflix Poster
Album Nhạc (Vinyl)
App Mockup
Ảnh Polaroid
Bảng giá (Pricing)
Team Members
Bài viết (Blog Slider)
Lộ trình (Roadmap)
Voucher (Tickets)
Chữ khổng lồ (Typography)
Sự kiện (Event Box)
Thống kê (Big Stats)
Thẻ chọn (Pill Categories)
Chồng bài (Stack Swipe)
🔥
Swipe Me
Hình học (Geometric)
Thẻ Review (Card)
Alex
1 ngày trước
★★★★★
Giao diện rất đẹp, code sạch sẽ dễ custom. Sẽ ủng hộ tiếp!
Các bước (Stepper)
- 1
- 2
- 3
Có Tiêu đề (Text Below)
✓
Giỏ hàng
2
Thanh toán
3
Hoàn tất
Trục dọc (Vertical)
1
Tạo tài khoản
2
Xác thực Email
Kèm Icon (Icons)
👤
💳
📦
Mũi tên (Chevron)
Bước 1
Bước 2
Bước 3
Thanh tiến độ (Progress Mix)
Đăng ký
Bảo mật
Hoàn tất
Đường nét đứt (Dashed)
Chi tiết phụ (Sub-text)
1
Shipping
Đã nhận đơn
2
Payment
Đang xử lý
3
Review
Chờ xác nhận
Thanh đứt đoạn (Segments)
Bước 3 / 4
Tối giản (Minimal Text)
Step 02
Thông tin cá nhân
Neumorphism
✓
2
3
Glassmorphism
1
2
3
Danh sách check (Checklist)
✓
Chọn mẫu giao diện
⚙
Tùy chỉnh màu sắc
Xuất Code
Cyberpunk Track
Cổ điển (Brutalism)
✓ Info
2. Plan
3. Pay
Vòng tròn thu nhỏ (Radial)
2/4
Thiết lập hồ sơ
Tiếp theo: Tải ảnh đại diện
Thẻ trượt (Pill Overlay)
Cơ bản
Bảo mật
Nâng cao
Viền Gradient (Glow)
1
2
3
Thẻ trạng thái dọc (Cards)
✓Đặt hàng thành công
🚚Đang giao hàng
📦Đã nhận hàng
Chấm sáng (Glowing Dot)
Hoàn tất (All Done)
✓
✓
✓
Thành công!
Nút mở rộng (Speed Dial)
Mở ngang phải (Horizontal)
Biến hình (Morphing)
+
Bung hình quạt (Radial)
Kèm nhãn (Labels)
Tạo văn bản
Tải lên
Neumorphism
Kính mờ (Glassmorphism)
Cyberpunk Menu
Thả dọc (Top-Down)
Mở ngang trái (Left)
Trình phát nhạc (Player)
Cổ điển (Brutalism)
Tỏa 4 hướng (Cross)
Tương tác Avatar
Sáng viền (Glow Neon)
Xếp thẻ (Stack)
Doc 1
Doc 2
📁
Cảm xúc (Reactions)
Menu vuông (Square List)
Lật 3D (3D Flip)
Mở rộng danh sách (List)
+
Nền động (Gradient)
Quạt góc trái (Left-Radial)
Vòng tròn 360° (Ring)
Toolbar trượt (Slide)
🛠️
Bảng màu (Color Picker)
Quỹ đạo (Orbiting)
☀️
macOS Dock
Lưới thư mục (Folder Grid)
D-Pad (Console)
Retro Start Menu
Programs
Gợi ý Chat (Quick Replies)
Lưới Kim cương (Diamond)
Bậc thang (Staircase)
Sóng nhạc (Equalizer)
Nút Tìm Kiếm (Search)
Trượt Ziczac
Chồng giấy nhớ (Notes)
Terminal (Console)
La bàn (Compass)
Trượt trong rãnh (Inset Reveal)
Thác đổ (Cascading Cards)
Lịch (Mini Calendar)
<Tháng 3, 2026>
T2
T3
T4
T5
T6
T7
CN
26
27
28
1
2
3
4
Lịch ngang (Weekly)
Hôm nay
13 Tháng 10
T212
T313
T414
T515
T616
Khoảng ngày (Date Range)
T2T3T4T5T6T7CN
28
29
30
1
2
3
4
5
6
7
8
9
10
11
Lịch sự kiện (Events)
S
M
T
W
T
F
S
1
2
3
4
5
6
7
Nổi khối (Neumorphism)
Tháng 4
12
13
14
15
Kính mờ (Glass)
<Tháng 5>
1
2
3
4
5
Dạ quang (Neon)
OCTOBER 2026
22
23
24
25
Chọn tháng (Month Grid)
Năm 2026
Th1
Th2
Th3
Th4
Th5
Th6
Th7
Th8
Lịch trình (Timeline)
09:00
Họp Team
Google Meet
10:30
Review Code
Tối giản (Minimalist)
24
Tháng 10, Thứ Sáu22
23
24
25
26
Gradient Calendar
Selected Date
18 Nov
Today
1617
18
1920
Cảnh báo (Alerts)
ℹ️ Thông tin: Vui lòng đọc kỹ hướng dẫn.
❌ Lỗi: Không thể kết nối đến máy chủ.
Cảnh báo có nút (Action)
✅
Lưu thành công!
Viền trái (Left Accent)
⚠️
Chú ý bảo mật
Mật khẩu của bạn đã quá cũ. Vui lòng thay đổi để đảm bảo an toàn.
Nền khối (Solid Background)
🔔
Bảo trì hệ thống
Hệ thống sẽ tạm ngưng vào lúc 00:00 đêm nay để nâng cấp.
Danh sách lỗi (Validation)
❌
Đã có lỗi xảy ra khi tạo tài khoản:
- Mật khẩu phải dài hơn 8 ký tự
- Tên đăng nhập đã tồn tại
Kính mờ (Glassmorphism)
💠
Cập nhật giao diện mới
Viền rỗng (Outline)
🚀 Trải nghiệm tính năng PRO
Viên thuốc (Pill Shape)
Bạn có 3 tin nhắn mới
Xem
Gradient Thông báo nổi bật
✨
KEMCode Premium
Neumorphism Alert
ℹ️
Giao diện nổi khối mềm mại.
Viền trên (Top Accent)
🛑
Cảnh báo nghiêm trọng
Tài khoản của bạn sẽ bị khóa trong 24h tới nếu không xác minh Email.
Bong bóng Chat
Chào cậu, giao diện này làm bằng Tailwind à?
Đúng rồi, mượt lắm luôn! 🚀
Đang gõ... (Typing)
Tin nhắn thoại (Voice)
Trả lời tin (Reply)
Hoàng Kim
Cuối tuần này đi cafe code không?
Triển luôn nha! ☕
Gửi ảnh (Images)
Góc làm việc mới setup xong nè!
Dấu thời gian (Date Stamp)
Hôm nay, 10:42 AM
Đã xem (Seen)
Tối nay mấy giờ gặp?
10:45 PM ✓✓
Khung gõ (Input Box)
Danh sách (Chat List)
Minh Anh
12:30Bản design này oke rồi nha sếp duyệt rồi.
2
Thả cảm xúc (Reactions)
Project này chốt giá 50 củ nha!
🔥 ❤️
Chat Nhóm (Group)
Bích Phương
Mọi người nay ăn gì để mình đặt luôn?
Gửi Tệp (File Share)
📄
Bao_Gia_2026.pdf
2.4 MB • PDF
Vị trí (Location Share)
📍
Landmark 81, Bình Thạnh
Cách đây 2km
Gợi ý Nhanh (Quick Replies)
Kính mờ (Glassmorphism)
Giao diện này ảo ma thật sự! ✨
Nổi khối (Neumorphism)
Soft UI nhìn êm mắt ghê.
Gradient Bubble
Khách VIP donate 50.000 VNĐ 💎
Cyberpunk Style
>_System override complete.
Livestream Chat
@dev_pro:Code xịn quá bạn ơi!
@admin:Cảm ơn mọi người nha ❤️
Cuộc bình chọn (Poll)
📍 Chốt địa điểm Team Building:
Đã có 10 người bình chọn
Gửi Danh bạ (Contact)
Trần Văn A
Giám đốc Kỹ thuật
Nhắn tin ngay
💬
Đánh giá (Testimonial)
"
Code cực sạch, giao diện mượt. Vote 5 sao cho team KEMCode!
K
Khách hàng VIP
★★★★★
Căn giữa (Centered)
★★★★★
"Trải nghiệm tuyệt vời! UI Lab giúp team mình tiết kiệm hàng chục giờ code CSS mỗi tuần."
Anna Bella
Product Manager
Bài đăng MXH (Social)
John Doe ✔
@johndoe_dev
Không thể tin được là mình có thể tìm thấy một bộ UI Tailwind xịn xò thế này. 10/10! 🔥🚀
10:42 AM · 12 Thg 5, 2026
Ngoặc kép chìm (Big Quote)
"
Thiết kế rất hiện đại và dễ dàng tùy biến. Chắc chắn sẽ sử dụng cho các dự án tiếp theo.
Trần Minh
CEO, TechStartup
Glassmorphism
⭐⭐⭐⭐⭐
"Giao diện kính mờ tuyệt đẹp, code cực kỳ nhẹ và chuẩn SEO."
Bong bóng Chat (Bubble)
Dịch vụ hỗ trợ khách hàng cực kỳ nhanh chóng. Mình gặp chút lỗi khi cài đặt và được giải quyết trong 5 phút!
Hoàng Vũ
Khách hàng xác thực
Neumorphism
"Mình cực kỳ thích phong cách Soft UI này, nó làm cho ứng dụng của mình trông khác biệt hoàn toàn."
D
David Pham
Nền Gradient (Gradient Card)
✨
★★★★★
"Một sự đầu tư vô cùng xứng đáng. Tính năng copy code siêu tiện lợi."
Sarah Connor
Freelancer
Đính kèm ảnh (Image/Proof)
Mai Phương
Thành quả sau 1 ngày áp dụng UI Lab vào dự án của mình nè 👇
Xem chi tiết
Cyberpunk Glitch
> FEEDBACK_LOG_#42
"Hệ thống hoạt động mượt mà. Đã bypass được toàn bộ giới hạn UI cũ. Highly recommend."
USR: K43L
RATING: MAX
Khách hàng B2B (Logo)
TECHCORP
★★★★★
"Nhờ KEMCode UI Lab, chúng tôi đã đẩy nhanh tiến độ dự án lên 40%. Một công cụ không thể thiếu cho đội ngũ frontend."
Cổ điển (Brutalism)
"TUYỆT ĐỈNH!"
Tôi chưa bao giờ thấy một bộ UI nào độc đáo và dễ dùng đến vậy.
T
Tony Stark
Thẻ lệch (Offset Overlap)
"Support siêu nhiệt tình, update tính năng mới liên tục."
Tuấn Anh
2 ngày trước
App Store Review
Giao diện quá xuất sắc
12/05★★★★★
Bởi Developer_VN
App chạy mượt, không có bug vặt. Các hiệu ứng rất tinh tế và không làm nặng máy.
Đánh giá Voice (Audio)
Lê Hùng
Khuyên dùng 100%
Thẻ xếp chồng (Stacked)
★★★★★
"Thiết kế đỉnh cao, cực kỳ hài lòng!"
Video Review
▶
Phỏng vấn khách hàng
Tối giản Nét đứt (Dashed)
"Simple is the best. Code dễ đọc và dễ custom."
- Mark.
#Review
Nhấn sao (Star Highlight)
5
Stars
Dịch vụ hoàn hảo
Mọi thứ đều đúng như quảng cáo, thậm chí còn tốt hơn.
Thẻ Carousel (Kèm Nút)
"Một công cụ tuyệt vời để tăng tốc độ phát triển. Tôi đã giới thiệu cho toàn bộ team."
Elon Musk
Tạp chí (Editorial)
"Tương lai của thiết kế UI."
Với sự tỉ mỉ trong từng chi tiết, KEMCode UI Lab đã tạo ra một tiêu chuẩn mới cho các thư viện component.
Tạp chí Tech Weekly
Bộ đếm (Stats Counter)
0
Lượt truy cập
Dashboard Card
Tổng doanh thu
$45,231
💰
Xu hướng tăng (Trend Up)
Người dùng mới
1,204
↗ +12.5%Xu hướng giảm (Trend Down)
Tỷ lệ thoát (Bounce Rate)
42.8%
↘ -2.4%Lưới 3 cột (Grid)
15K
Lượt xem
2.4K
Lượt thích
840
Bình luận
Uptime Hệ thống
Hệ thống Online
99.99%
Kèm Biểu đồ Mini
Traffic tuần
24,592
Vòng tiến trình
75%
Dung lượng
Đã dùng 75GB / 100GB
Thanh tiến độ
Mục tiêu tháng
80%
Còn 20 đơn hàng nữa
Neumorphism
🏆
1,402
Điểm uy tín
Glassmorphism
98.5%
Tỷ lệ hài lòng
Cyberpunk Glitch
SYS_MEM
> THREAD_COUNT
10,424
Tối giản (Minimalist)
8.4M
Dòng code đã viết
Thẻ Dọc (Vertical)
👥
10K+
Thành viên
So sánh (VS Stats)
Thu nhập
$4.2k
VS
Chi phí
$1.8k
Cột mốc (Milestone)
Hôm nay, 10:00 AM
Đạt 1,000 Sales! 🎉
Mục tiêu quý đã hoàn thành.
Đếm ngược (Timer)
Thời gian đã tiết kiệm
24
Giờ
:
45
Phút
Dạng Thẻ (Pill Badge)
Live Viewers
3,492
Cổ điển (Brutalism)
99+
Mẫu giao diện
Đánh giá Sao (Rating)
4.9
★★★★★
2.5K
Đánh giá
Chữ Gradient Động
10M+
Lượt tải xuống
Máy nghe nhạc
🎵
Lofi Chill Beats
Podcast Player
Tập 42
Tương lai của UI/UX
12:3045:00
Kính mờ (Glassmorphism)
🌌
Starboy
The Weeknd
1:20
Đĩa Than (Vinyl)
Video Controls
▶
1:04 / 3:20
Sóng âm (Visualizer)
Đang phát...
Băng Cassette (Retro)
MIX TAPE 90s
Màn hình khóa (Lockscreen)
Electronic Vibes
Daft Punk
Neumorphism Player
🎵
Cyberpunk Music
> Night_City.mp3
Tối giản (Minimalist)
Lo-fi Study
Dạng danh sách (List Item)
▶
Concert Live
Various Artists
Gradient Vibe
Now Playing
Tin nhắn thoại (Voice Note)
Cổ điển (Brutalism)
PUNK ROCK
Nổi (Floating Pill)
Jazz Mix
Lời bài hát (Lyrics)
And it was all yellow
Look at the stars
Look how they shine for you
Chế độ lái xe (Driving)
Bản Mở Rộng (Expanded)
Festival Night
Live Session
Radio Trực tiếp (Live)
🎙️
Live
FM 99.9 KEM Station
Thời tiết (Weather)
☀️
Hồ Chí Minh
32°C
Nắng đẹp, không mưa
Tối giản (Minimalist)
Hà Nội
28°
⛅
Nhiều mây
Ban đêm (Night Mode)
18°
Trời quang mây
Dự báo theo giờ (iOS Style)
Hôm nay
Bây giờ☀️32°
14:00⛅33°
15:00☁️31°
16:00🌧️28°
Glassmorphism
🌤️
Đà Lạt
Hơi se lạnh, độ ẩm 80%
Neumorphism
🌦️
26°
Đà Nẵng
Hiệu ứng Mưa (Rain)
22°C
Mưa rào
Cổ điển (Brutalism)
WEATHER
35°C
☀️
Cyberpunk Status
ENV_SCAN
29°
> TOXIC: LOW
> HUMIDITY: 65%
Biểu đồ (Chart Mockup)
Hôm nay
Max 34° - Min 24°
30°
34°
28°
24°
Chất lượng KQ (AQI)
85
AQI
Trung bình
Nhạy cảm nên hạn chế ra ngoài lâu.
Dự báo 3 ngày
Th 2☀️
Th 3⛅
Th 4🌧️
Đồng hồ & Thời tiết
10:42
Thứ 6, 12 Tháng 5
⛅
28°C - Hà Nội
Chi tiết (Details Grid)
💧
Độ ẩm
82%
💨
Gió
12 km/h
☀️
UV Index
6 (Cao)
👁️
Tầm nhìn
10 km
Dông bão (Thunderstorm)
20°C
Sấm chớp
Tile (Windows Style)
⛅
30°
Hồ Chí Minh
Nhiều mây
Tuyết rơi (Snowfall)
-2°C
Tuyết nhẹ
Hoàng hôn (Sunset)
27°C
Hoàng hôn đẹp
Chu kỳ Trăng (Moon Phase)
Trăng lưỡi liềm
Chiếu sáng: 24%
Vuốt ngang (Swipeable)
Cảnh báo (Severe Alert)
⚠️
Bão nhiệt đới
Cảnh báo gió giật mạnh cấp 10. Hạn chế ra ngoài.
Biểu đồ Cột (CSS Chart)
40
70
90
50
Biểu đồ Donut (CSS)
80%
Web (45%)
App (35%)
Cột ngang (Horizontal Bar)
Direct Traffic75%
Social Media45%
Referrals30%
Biểu đồ Đường (Line Chart)
Biểu đồ Vùng (Area Chart)
Đồng hồ (Gauge)
65%
Hiệu suất
Lưới nhiệt (Heatmap)
Đóng góp trong 1 tháng qua
Vòng hoạt động (Activity)
Cột xếp chồng (Stacked Bar)
Đa giác (Radar Chart)
Nến tài chính (Candlestick)
Phễu chuyển đổi (Funnel)
Truy cập (10k)
Click (6k)
Thêm giỏ (2k)
Mua (500)
Lưới Waffle (Waffle Chart)
65%
Tia lửa (Sparkline)
Lượt xem
4,200
Phân tán (Scatter Plot)
Bong bóng (Bubble Chart)
A
B
C
Đường Kép (Multi-line)
--- Kế hoạch
— Thực tế
Tiến độ & Mục tiêu (Bullet)
Đạt được
Giới hạn
Mục tiêu
Thác nước (Waterfall)
Bắt đầu
Thu
Chi
Thu
Tổng
Thanh tỷ lệ (Segmented)
Dung lượng ổ cứng (1TB)
OS (40%)
App (25%)
Doc (15%)
Vòng cung (Concentric)
Widget Tổng hợp
Tổng doanh thu
$45.2k
Thẻ ẩn (Hover Reveal)
Rê chuột vào đây! 👇
🎉
Bất ngờ chưa!
Nội dung này được ẩn đi rất khéo léo.
Trượt lên (Slide Up)
Rê chuột vào đây
🚀
Đã mở khóa!
Tách đôi (Split Doors)
Mở
Cửa
Chào mừng! 🎉
Vòng tròn (Iris Mask)
Hover me!
Phép thuật CSS ✨
Trượt ngang (Swipe)
Nội dung ẩn ở sau...
Vuốt ngang 👉
🔍
👤
Hồ sơ của bạn
Nút giãn nở (Expand)
Gấp góc (Corner Fold)
Ghi chú quan trọng! Hover vào góc phải.
Secret
Kéo
Thẻ cào (Scratch)
🎁 100.000đ
Cào để xem
Khối lật 3D (Cube)
Mặt trước
Mặt ẩn (Bottom)
Mở thư (Envelope)
Thư mời
Gửi bạn KEMCode!
Xòe bài (Card Stack)
Thẻ 1
Thẻ 2
Thẻ 3
Quét mã (Cyber Scan)
HIDDEN
UNLOCKED
Chữ rõ dần (Blur Focus)
Mã giảm giá của bạn là: KEMCODE2026
Mở rèm ngang (Horizontal)
Tùy chọn A
Tùy chọn B
Bóc nhãn (Peel Off)
Nội dung Bí mật
Bóc tem!
Rèm cửa lật (Shutter)
Surprise! 🎁
Tô màu (Paint Reveal)
KEMCode
Nhấn lún (Press)
Kéo ruy-băng (Ribbon)
Quà tặng 50%
Sản phẩm bí mật
Pop-up Text
Nhiều tính năng thú vị!
Kéo ảnh (Pull Image)
Tính năng mới 2026
Khung Code (Code Snippet)
Terminal (Ubuntu)
user@kemcode: ~
user@kemcode:~$ npm install tailwindcss
Installing packages...
✔ Added 120 packages in 3s
Installing packages...
✔ Added 120 packages in 3s
IDE Theme (Có số dòng)
123
function initApp() {
return "KEMCode Ready!";
}
Git Diff (Thay đổi)
-const theme = 'light';
+const theme = 'dark';
Tab Ngôn ngữ (Tabs)
index.js
style.css
import React from 'react';
Light Theme (Sáng)
@media (max-width: 768px) {
.mobile-hidden { display: none; }
}
.mobile-hidden { display: none; }
}
Neumorphism Code
<div class="soft-ui">
<p>Nổi khối mượt mà</p>
</div>
<p>Nổi khối mượt mà</p>
</div>
Glassmorphism
backdrop-filter: blur(10px);
background: rgba(0, 0, 0, 0.4);
background: rgba(0, 0, 0, 0.4);
Cyberpunk Theme
SYS.CODE
> ENCRYPTING_DATA...
ACCESS GRANTED.
ACCESS GRANTED.
JSON Viewer
{
"status": 200,
"message": "Success",
"data": [ ]
}
"status": 200,
"message": "Success",
"data": [ ]
}
Viền Gradient
export const Config = {
theme: 'gradient'
};
theme: 'gradient'
};
Ngoại lệ (Error Trace)
Uncaught TypeError: Cannot read properties of undefined (reading 'map')
at renderList (app.js:24:15)
at main (index.js:10:5)
at renderList (app.js:24:15)
at main (index.js:10:5)
Focus Line (Làm nổi bật)
function calculate() {
return a + b; // Lỗi ở đây
}
Kèm Nhãn Ngôn Ngữ
PYTHON
def hello_world():
print("Hello!")
print("Hello!")
Thu gọn (Collapsible)
Hiển thị mã nguồn ▼
<div class="hidden">Khám phá bí mật!</div>
Tích hợp Kết quả (Output)
echo "<b>KEMCode</b>";
KEMCode
SQL Query Block
SELECT id, name, email
FROM users
WHERE status = 'active'
ORDER BY created_at DESC;
FROM users
WHERE status = 'active'
ORDER BY created_at DESC;
Sao chép thành công
✓ Copied!
npx create-react-app kemcode-ui
Markdown Block
# Tiêu đề H1
Đây là đoạn văn bản có chứa `inline code` và **in đậm**.
Đây là đoạn văn bản có chứa `inline code` và **in đậm**.
Auto-Typing Code
>_
npm run start
Inline Snippet (Trong văn bản)
Để cài đặt thư viện này, vui lòng chạy lệnh
composer require kemcode/ui vào terminal của bạn. Hệ thống sẽ tự động liên kết.
Nút Công Tắc Xịn (Toggles)
Wi-Fi (iOS)
Giao diện
Giao diện (Theme)
Chế độ ban đêm
Chữ bên trong (ON/OFF)
Trạng thái
Neumorphism
Âm thanh
Glassmorphism
Blur Mode
Cyberpunk
> OVERRIDE
Cổ điển (Brutalism)
POWER
Nét mảnh (Thin Line)
Tự động lưu
Khối vuông (Square)
Đồng bộ
Material Style
Vị trí
Bầu trời Ngày/Đêm
Giao diện
Icon Check/Close
Hoạt động
3D Lún Trượt
Chống rung
Co giãn (Liquid Stretch)
Hiệu ứng
Tùy chọn kép (Dual Option)
Cảm xúc (Emoji Switch)
Tâm trạng
Khóa (Lock/Unlock)
Bảo mật
Viền Glow (Gradient)
Chế độ VIP
Dọc (Vertical)
Microphone (Mute)
Ghi âm
Bluetooth Scan
Bluetooth