[Source Code] Convix Software - PR Agency SaaS Landing Page
FULL SOURCE CODE: CONVIX SOFTWARE — PR-AGENCY SAAS LANDING PAGE Bộ giao diện Landing Page SaaS giới thiệu phần mềm quản lý & tự động hóa PR Agency hiện đại với khay xem trước Dashboard tương tác rực rỡ và biểu đồ đồng hồ Gauge Meter SVG độc quyền! 🌟 TÍNH NĂNG NỔI BẬT: - Khung Hero tràn viền bo góc bo cong (Rounded Hero Frame): Toàn bộ video nền, navbar và nội dung chính nằm gọn trong khung chứa bo tròn 24px/32px sang trọng. - Logo hoa thị 8 cánh Cam Accent (#ef4d23): Logo vector chuẩn tỉ lệ cùng thanh Menu dạng viên thuốc nổi (Pill Navbar) mượt mà. - Khai thác Typography Instrument Serif Italic: Tiêu đề "Shaping Agencies of tomorrow" phối hợp font chữ thanh lịch điểm xuyết chất thơ nghệ thuật. - Khay Dashboard Preview thực tế (Dashboard Preview Tray): + Card 1: Thống kê Clicks 6,896 kèm biểu đồ Gauge Meter SVG 92% màu cam và nhãn mục tiêu tháng. + Card 2: Form cấu hình tùy chỉnh khoảng thời gian (MTD) và chỉ số mục tiêu tháng/năm. + Card 3: Thống kê Video Starts kèm đồng hồ đo 68%. - Component Gauge SVG tái sử dụng (Reusable Gauge Component): Tạo biểu đồ đồng hồ hình bán nguyệt 40 vạch chia sắc nét. - Responsive 100%: Tự động co giãn linh hoạt từ 1 -> 2 -> 3 cột theo kích thước màn hình. 🛠️ CÔNG NGHỆ SỬ DỤNG: - React 19 / TypeScript - Font Inter & Instrument Serif Google Fonts - Vite 8 - Tailwind CSS 3 - Lucide React Icons 🚀 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: CONVIX SOFTWARE — PR-AGENCY SAAS LANDING PAGE Bộ giao diện Landing Page SaaS giới thiệu phần mềm quản lý & tự động hóa PR Agency hiện đại với khay xem trước Dashboard tương tác rực rỡ và biểu đồ đồng hồ Gauge Meter SVG độc quyền! 🌟 TÍNH NĂNG NỔI BẬT: - Khung Hero tràn viền bo góc bo cong (Rounded Hero Frame): Toàn bộ video nền, navbar và nội dung chính nằm gọn trong khung chứa bo tròn 24px/32px sang trọng. - Logo hoa thị 8 cánh Cam Accent (#ef4d23): Logo vector chuẩn tỉ lệ cùng thanh Menu dạng viên thuốc nổi (Pill Navbar) mượt mà. - Khai thác Typography Instrument Serif Italic: Tiêu đề "Shaping Agencies of tomorrow" phối hợp font chữ thanh lịch điểm xuyết chất thơ nghệ thuật. - Khay Dashboard Preview thực tế (Dashboard Preview Tray): + Card 1: Thống kê Clicks 6,896 kèm biểu đồ Gauge Meter SVG 92% màu cam và nhãn mục tiêu tháng. + Card 2: Form cấu hình tùy chỉnh khoảng thời gian (MTD) và chỉ số mục tiêu tháng/năm. + Card 3: Thống kê Video Starts kèm đồng hồ đo 68%. - Component Gauge SVG tái sử dụng (Reusable Gauge Component): Tạo biểu đồ đồng hồ hình bán nguyệt 40 vạch chia sắc nét. - Responsive 100%: Tự động co giãn linh hoạt từ 1 -> 2 -> 3 cột theo kích thước màn hình. 🛠️ CÔNG NGHỆ SỬ DỤNG: - React 19 / TypeScript - Font Inter & Instrument Serif Google Fonts - Vite 8 - Tailwind CSS 3 - Lucide React Icons 🚀 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.