Quy Chuẩn Giao Diện UI/UX v1.0 Design System
Phong cách chuẩn nhận diện CHILLTECH - Cơ Điện Lạnh Công Nghiệp
Hệ Thống Nhận Diện & Thiết Kế Giao Diện Cơ Điện Lạnh
Trang chuẩn mực UI/UX cho toàn bộ website chilltechvietnam.com. Bao gồm cấu trúc màu xanh công nghiệp (#22a338), màu cam chuyển đổi & hotline (#f35a06), màu đỏ nhận diện thương hiệu (#dc2626), nút bấm 2 dòng, thẻ sản phẩm, dropdown menu checkmark, thanh CTA liên hệ và bộ Prompt AI chuyên ngành Chiller.
Hồ Sơ Doanh Nghiệp & Pháp Lý (Chilltech Co., Ltd) Đăng Ký Kinh Doanh Hợp Pháp
Căn cứ theo Giấy chứng nhận Đăng ký Doanh nghiệp & Hồ sơ pháp lý chính thức
CÔNG TY TNHH CƠ ĐIỆN LẠNH CHILLTECH
CHILLTECH MECHANICAL ELECTRICAL REFRIGERATION COMPANY LIMITED
Số 02, ngõ 816/51/24 đường Kim Giang
Phường Thanh Liệt, Thành phố Hà NộiBảng Chi Tiết Hồ Sơ Đăng Ký Doanh Nghiệp (Căn Cứ Văn Bản)
| Mục Hồ Sơ | Nội Dung Đăng Ký Chính Thức | Quy Cách Ứng Dụng Trên Website | Thao Tác |
|---|---|---|---|
| Tên công ty tiếng Việt (In hoa) | CÔNG TY TNHH CƠ ĐIỆN LẠNH CHILLTECH | Bắt buộc in hoa trên Footer, Hợp đồng, Hóa đơn VAT, Báo giá | |
| Tên tiếng nước ngoài | CHILLTECH MECHANICAL ELECTRICAL REFRIGERATION COMPANY LIMITED | Sử dụng trong giao dịch quốc tế, CO/CQ, Catalog tiếng Anh | |
| Tên viết tắt | CHILLTECH CO.,LTD | Dùng cho logo, watermark tài liệu kỹ thuật, icon đại diện | |
| Địa chỉ trụ sở chính | Số 02, ngõ 816/51/24 đường Kim Giang, Phường Thanh Liệt, Thành phố Hà Nội, Việt Nam | Địa chỉ xuất hóa đơn GTGT, tiếp nhận bưu phẩm bảo hành | |
| Số điện thoại liên hệ | 0968 189 793 | Hotline chính trên topbar, nút gọi nổi, tư vấn kỹ thuật | |
| Thư điện tử (Email) | codienlanhchilltech@gmail.com | Gửi nhận hợp đồng kinh tế, file báo giá Chiller, hóa đơn điện tử | |
| Website chính thức | chilltechvietnam.com | Tên miền chính thức của thương hiệu Cơ Điện Lạnh Chilltech | |
| Ngành, nghề kinh doanh chính | Sửa chữa, bảo dưỡng máy móc thiết bị cơ điện lạnh, Chiller công nghiệp; Cung cấp phụ tùng máy nén và dầu lạnh Chiller các hãng. | Mã ngành cấp 4 Hệ thống ngành kinh tế Việt Nam |
Khối Mẫu Snippet Chuẩn Sẵn Dùng Cho Giao Diện & Kỹ Thuật
Sao chép nhanh các khối Blade / HTML / Text đã được định dạng chuẩn để nhúng ngay vào website
• Trụ sở: Số 02, ngõ 816/51/24 đường Kim Giang, P. Thanh Liệt, Hà Nội
• Điện thoại: 0968 189 793
• Email: codienlanhchilltech@gmail.com
• Website: chilltechvietnam.com
• Tên đơn vị: CÔNG TY TNHH CƠ ĐIỆN LẠNH CHILLTECH
• Địa chỉ: Số 02, ngõ 816/51/24 đường Kim Giang, P. Thanh Liệt, TP. Hà Nội
• Email nhận HĐ: codienlanhchilltech@gmail.com
Thời gian làm việc: 8h - 22h tất cả các ngày trong tuần
CÔNG TY TNHH CƠ ĐIỆN LẠNH CHILLTECH
Hotline: 0968 189 793 | Email: codienlanhchilltech@gmail.com
Website: https://chilltechvietnam.com
1. Bảng Màu Quy Chuẩn (Color Palette)
Màu sắc công nghiệp dựa theo nhận diện CHILLTECH trên các ảnh mẫu
Xanh Công Nghiệp Chiller (Primary Brand Color) - Dùng cho banner header, menu sản phẩm, thanh CTA, nút chính
Màu Cam Chuyển Đổi & Hotline (Action / CTA Color) - Dùng cho nút Hotline, nút Yêu Cầu Tư Vấn, icon giỏ hàng, nút tìm kiếm
Màu Trung Tính Công Nghiệp (Industrial Neutrals)
2. Hệ Thống Kiểu Chữ (Typography)
Phân cấp kích thước, độ dày font và tiêu đề chuẩn phong cách CHILLTECH
Khắc phục triệt để tình trạng lỗi font tiếng Việt (nhảy dấu, lệch chân chữ, font CJK) và chữ quá dày thô (font-black 900). Quy chuẩn sử dụng độ dày tối đa font-bold (700) cho tiêu đề và font-normal (400) cho nội dung giúp giao diện thanh thoát, sắc nét đúng chuẩn ảnh mẫu gốc.
LIÊN HỆ
CÔNG TY TNHH CƠ ĐIỆN LẠNH CHILLTECH
- • Địa chỉ: Số 6, Ngõ 21, Đường Hòa Bình, Tổ 14, Phường Yên Nghĩa, Quận Hà Đông, Hà Nội
- • MST: 0107858471
- • Người đại diện: NGUYỄN QUYẾT CHIẾN
- • Điện thoại: 0984 106 085
- • Email: dienlanhtoancau2017.vn@gmail.com
| Thành Phần | Kích Thước | Độ Dày (Weight) | Màu Sắc | Quy Tắc Trình Bày |
|---|---|---|---|---|
| Tiêu đề trang (Page Title / H1) | 20px - 24px | Bold (700) | #f35a06 (Cam) | IN HOA toàn bộ, không đổ bóng, chuẩn trang liên hệ / chi tiết |
| Tên doanh nghiệp / Tiêu đề khối | 15px - 16px | Bold (700) | #111827 (Đen) | IN HOA toàn bộ, định danh thương hiệu uy tín |
| Breadcrumb đường dẫn | 13px - 14px | Regular (400) | #22a338 (Xanh) | Gạch dưới khi hover, ngăn cách bằng ký tự » màu xám #94a3b8 |
| Nội dung danh sách (Bullet Points) | 14px | Regular (400) | #1f2937 (Slate 800) | Dùng dấu chấm • đen, giãn dòng leading-normal (khoảng cách 10px giữa các mục) |
| Banner khẩu hiệu chính | 20px - 28px | Black (900) | #ffffff trên nền #22a338 | IN HOA, chữ trắng nền xanh lá công nghiệp |
| Số Hotline / Điện thoại | 16px - 20px | Black (900) | #f35a06 hoặc Trắng | Định dạng có dấu chấm hoặc khoảng cách: 0984 106 085 hoặc 0984.106.085 |
DẦU LẠNH MÁY NÉN CHILLER, CÔNG NGHIỆP
Xem tất cả »SẢN PHẨM TƯƠNG TỰ
LỌC DẦU CHILLER YORK 026-37563-000 (Dành cho máy nén trục vít YS, YK)
CHILLTECH chuyên cung cấp định kỳ và bảo dưỡng thay thế dầu lạnh máy nén hệ thống điều hòa công nghiệp, máy làm lạnh hệ Chiller tại Việt Nam giá cả hợp lý, hàng chính hãng. Cam kết có đầy đủ CO/CQ, hỗ trợ kỹ thuật và giao hàng nhanh trong 2h tại nội thành.
Quy Chuẩn Khoảng Cách & Bố Cục (Spacing & Sizing)
Hệ thống thước đo khoảng cách 4px, khung chứa (containers), phân bổ lưới sản phẩm và độ bo góc
1. Thước Đo Khoảng Cách Chuẩn (Tailwind Spacing Scale - Bội Số 4px)
Áp dụng nhất quán cho Padding (p-), Margin (m-), và Khoảng cách lưới (gap-)
2. Khung Chứa Trang & Chiều Rộng Tối Đa (Containers)
Quy định chiều rộng hiển thị chuẩn cho từng thành phần giao diện
Dùng cho Header, Navigation bar, Lưới sản phẩm, Khối nội dung chính và Chân trang Footer.
Dùng cho dải banner xanh lá chứa hộp thời gian làm việc & hotline miền Bắc.
Chiều rộng lý tưởng cho thanh tìm kiếm phụ tùng ở trung tâm header.
Dùng cho popup tư vấn nhanh, hộp đăng ký báo giá khẩn cấp.
3. Quy Chuẩn Bo Góc & Thiết Kế Phẳng (Flat Design - Tránh AI Slop)
Giảm bo góc tối đa và loại bỏ hoàn toàn bóng đổ để giao diện sắc sảo, kỹ thuật, chuyên nghiệp
• Không bóng đổ (No Shadows): Loại bỏ toàn bộ shadow-sm, shadow-md, shadow-lg, hover:shadow-xl trên card và nút bấm.
• Viền phân tách tinh tế: Dùng border border-slate-200 màu xám trung tính, tuyệt đối tránh viền đen đậm/thô.
• Hover tinh tế: Khi rê chuột vào card, chỉ đổi màu viền sang xanh hover:border-[#22a338] kết hợp phóng nhẹ ảnh group-hover:scale-105, không đẩy bóng nổi giả tạo.
3. Nút Bấm & Kêu Gọi Hành Động (Buttons & CTAs)
Thiết kế nút 2 dòng tỷ lệ chuyển đổi cao, nút hotline cam và nút xanh công nghiệp
Nút cam conversion cao nhất, hiển thị số điện thoại to và lời mời gửi giá
Nút xanh lá full width với thông điệp giao hàng hỏa tốc 2 giờ
Cố định đáy màn hình điện thoại giúp khách gọi và nhắn tin nhanh
4. Thẻ & Khung Mẫu Sản Phẩm (Cards)
Mẫu card sản phẩm Chiller, card danh mục checkmark, và khối cam kết
Thẻ Sản Phẩm Chuẩn CHILLTECH (E-Commerce Product Card)
Dầu lạnh Hanbell dùng cho máy nén trục vít Ly tâm ga R134a
Lọc dầu Chiller York 026-37563-000 chuẩn OEM có CO/CQ
Lọc dầu máy nén Chiller Trane FLR01353 / ELM01405 chính hãng
Dầu lạnh bôi trơn Chiller York 'K' / 'L' / 'S' chuyên dụng máy nén
Lọc dầu máy nén Chiller Carrier 06NA660010 cho cụm máy 30XW
Lọc dầu Chiller Daikin máy nén ly tâm & trục vít chính hãng
Dầu lạnh bôi trơn Carrier Totaline PP23BZ104005 (Thùng 18.9L)
Dầu lạnh Solest 68 / 120 / 170 / 220 cho máy nén trục vít ga R134a
DANH MỤC SẢN PHẨM
Hiển thị dưới nút đặt hàng ở trang chi tiết sản phẩm
MIỄN PHÍ LẮP ĐẶT
Đơn hàng từ 200.000đ tại nội thành Hà Nội
VẬN CHUYỂN TOÀN QUỐC
Nhận hàng kiểm tra và thanh toán tận nơi
LÀM VIỆC 8H - 21H30
Kể cả ngày thứ 7 và Chủ nhật toàn quốc
Trung tâm sửa Chiller tại Nghệ An giá rẻ, có VAT, phục vụ 24/7
Cơ Điện Lạnh Chilltech | 24/02/20265. Tags & Badges (Huy Hiệu & Nhãn Kỹ Thuật)
Phân loại tình trạng kho, môi chất lạnh Gas, thương hiệu và chứng chỉ
6. Biểu Mẫu & Trường Nhập Liệu (Forms & Inputs)
Khung tìm kiếm header chuẩn và Form yêu cầu báo giá phụ tùng Chiller công nghiệp
Input text bo viền kèm nút cam tìm kiếm gắn liền bên phải
Form Yêu Cầu Báo Giá Phụ Tùng Chiller (RFQ Industrial Form)
Gửi thông tin model máy để nhận báo giá cạnh tranh trong vòng 15 phút
7. Prompt AI Quy Chuẩn Giao Diện (Master UI Prompt) Chỉ 1 Prompt Duy Nhất
Dán prompt này cho bất kỳ AI nào (ChatGPT, Claude, Gemini, DeepSeek) để AI hiểu và code chuẩn 100% giao diện CHILLTECH
Chứa trọn bộ mã màu Hex, font chữ, button 2 dòng, card sản phẩm, dropdown menu, form và layout từ các ảnh mẫu.
Chỉ cần sao chép 1 lần và dán vào đầu đoạn chat với AI. AI sẽ nhớ và code chuẩn xác từng class Tailwind CSS.
Tối ưu cho ChatGPT-4o, Claude 3.5 Sonnet, Gemini 1.5/2.0, DeepSeek R1 và GitHub Copilot.
8. Bảng Thông Số Kỹ Thuật (Specs Table)
Mẫu bảng so sánh các dòng dầu lạnh máy nén Chiller công nghiệp
Bảng Quy Cách & Thông Số Kỹ Thuật Dầu Lạnh Máy Nén Chiller
Dữ liệu tham khảo tiêu chuẩn ASHRAE 34 & tiêu chuẩn OEM chính hãng
| Tên Dầu Lạnh / Model | Hãng Máy Tương Thích | Độ Nhớt (40°C) | Gas Tương Thích | Quy Cách Đóng Gói | Trạng Thái Kho | Báo Giá |
|---|---|---|---|---|---|---|
| Hanbell HBR-B01 | Máy nén Hanbell RC / RG | 170 cSt | R134a | Thùng 18.9L / Phuy 208L | Sẵn kho HN | Liên hệ |
| York Oil Type F | Chiller York YS, YK, YT | 68 cSt | R134a / R22 | Thùng 5 Gallon (18.9L) | Sẵn kho HN & HCM | Liên hệ |
| Trane OIL 00027 | Trane RTAC, RTHD, CVHE | 68 cSt (POE) | R134a | Can 1 Gallon (3.78L) | Sẵn kho | Liên hệ |
| Bitzer BSE 32 / 55 | Máy nén Bitzer CSH, CSX | 32 / 55 cSt | R134a/R404A | Can 5L / 10L | Sẵn kho | Liên hệ |
| Carrier Totaline PP23BZ | Chiller Carrier 30XA, 30XW | 120 cSt | R134a | Thùng 18.9L (5 Gallon) | Sẵn kho | Liên hệ |
| Solest 68 / 120 / 170 | Đa năng máy nén trục vít | 68-170 cSt | R134a/R410A | Thùng 18.9L | Đặt hàng 24h | Liên hệ |
9. Mẫu Layout Chuẩn Theo Ảnh (Components Mẫu)
Mẫu dựng hoàn chỉnh của Top Announcement Bar, CTA Bar và Footer theo các ảnh 1, 2, 3