![[Source Code] Prosthetics Hero - Smart Prosthetics Landing Page](/api/backend/storage/public/product-media/user_3bf20fb7af5b8145/69d09ebf1b2581e138d9592e0415331a-animated-49.webp)
[Source Code] Prosthetics Hero - Smart Prosthetics Landing Page
FULL SOURCE CODE: PROSTHETICS HERO — SMART PROSTHETICS LANDING PAGE Bộ giao diện Single-Page Hero Landing Page giới thiệu thiết bị y tế & tay chân giả thông minh phong cách hiện đại, tinh tế dành riêng cho các dự án MedTech, Startup Y tế hoặc sản phẩm khoa học công nghệ! 🌟 TÍNH NĂNG NỔI BẬT: - Bố cục Pill Navigation đôi độc đáo: Thanh điều hướng căn giữa với 2 khối viên thuốc riêng biệt (Logo bên trái & Menu Story, Products, Help, Support bên phải). - Căn lề góc dưới bên trái (Bottom-Left Hero Content): Tôn vinh không gian hình ảnh video chính với nội dung cô đọng tối ưu trải nghiệm đọc. - Badge danh tiếng (Shark Tank India Badge): Dòng tin tức uy tín "Seen on Shark Tank in India →" kèm hiệu ứng mũi tên dịch chuyển mượt khi di chuột. - Fullscreen Video Loop Background: Nền video tràn màn hình 100% tái hiện chuyển động tự nhiên của sản phẩm. - Nút bấm CTA "Try a free fitting →": Hiệu ứng chuyển màu xanh dương (Blue-500) tràn viền mượt 200ms khi hover. - Responsive 100%: Tương thích chuẩn xác trên màn hình PC và di động. 🛠️ CÔNG NGHỆ SỬ DỤNG: - React 19 / TypeScript - Vite 8 - Tailwind CSS 3 - Custom Inline Vector Logo SVG 🚀 HƯỚNG DẪN CÀI ĐẶT & CHẠY DỰ ÁN: 1. Giải nén file .zip 2. Mở terminal tại thư mục dự án và chạy: npm install 3. Khởi chạy giao diện thử nghiệm: npm run dev 4. Build ra sản phẩm thực tế: npm run build (Đã đính kèm file HUONG_DAN_SU_DUNG_VA_DEPLOY.md hướng dẫn từng bước thay đổi nội dung, màu sắc và đưa lên mạng miễn phí!) 📩 Hỗ trợ giải đáp & hướng dẫn cài đặt nếu gặp khó khăn trong quá trình sử dụng.
Mô tả sản phẩm
FULL SOURCE CODE: PROSTHETICS HERO — SMART PROSTHETICS LANDING PAGE Bộ giao diện Single-Page Hero Landing Page giới thiệu thiết bị y tế & tay chân giả thông minh phong cách hiện đại, tinh tế dành riêng cho các dự án MedTech, Startup Y tế hoặc sản phẩm khoa học công nghệ! 🌟 TÍNH NĂNG NỔI BẬT: - Bố cục Pill Navigation đôi độc đáo: Thanh điều hướng căn giữa với 2 khối viên thuốc riêng biệt (Logo bên trái & Menu Story, Products, Help, Support bên phải). - Căn lề góc dưới bên trái (Bottom-Left Hero Content): Tôn vinh không gian hình ảnh video chính với nội dung cô đọng tối ưu trải nghiệm đọc. - Badge danh tiếng (Shark Tank India Badge): Dòng tin tức uy tín "Seen on Shark Tank in India →" kèm hiệu ứng mũi tên dịch chuyển mượt khi di chuột. - Fullscreen Video Loop Background: Nền video tràn màn hình 100% tái hiện chuyển động tự nhiên của sản phẩm. - Nút bấm CTA "Try a free fitting →": Hiệu ứng chuyển màu xanh dương (Blue-500) tràn viền mượt 200ms khi hover. - Responsive 100%: Tương thích chuẩn xác trên màn hình PC và di động. 🛠️ CÔNG NGHỆ SỬ DỤNG: - React 19 / TypeScript - Vite 8 - Tailwind CSS 3 - Custom Inline Vector Logo SVG 🚀 HƯỚNG DẪN CÀI ĐẶT & CHẠY DỰ ÁN: 1. Giải nén file .zip 2. Mở terminal tại thư mục dự án và chạy: npm install 3. Khởi chạy giao diện thử nghiệm: npm run dev 4. Build ra sản phẩm thực tế: npm run build (Đã đính kèm file HUONG_DAN_SU_DUNG_VA_DEPLOY.md hướng dẫn từng bước thay đổi nội dung, màu sắc và đưa lên mạng miễn phí!) 📩 Hỗ trợ giải đáp & hướng dẫn cài đặt nếu gặp khó khăn trong quá trình sử dụng.