Trình tạo CSS gradient
Thiết kế gradient nền bằng giao diện trực quan và sao chép CSS dùng được ngay. Kéo các điểm màu dọc theo thanh, nhấp vào thanh để thêm điểm, đổi góc hoặc tâm và làm màu trong suốt. Mã có kèm màu đặc dự phòng cho trình duyệt cũ.
Cách sử dụng
- Chọn tuyến tính, tròn hoặc hình nón, hoặc bắt đầu từ mẫu sẵn hay gradient ngẫu nhiên.
- Nhấp vào một điểm để sửa màu, độ mờ đục và vị trí; kéo để di chuyển, hoặc nhấp vào thanh để thêm điểm khác.
- Sao chép CSS và dán vào quy tắc của phần tử.
Câu hỏi thường gặp
Gradient tuyến tính, tròn và hình nón khác nhau thế nào?
Gradient tuyến tính đổi màu dọc theo một đường thẳng theo góc bạn chọn. Gradient tròn (radial) lan ra từ tâm theo hình tròn hoặc elip. Gradient hình nón (conic) xoay quanh tâm như kim đồng hồ, hữu ích cho bánh xe màu và biểu đồ tròn.
Gradient CSS có chạy trên mọi trình duyệt không?
Có. Gradient tuyến tính, tròn và hình nón chạy trên mọi phiên bản hiện tại của Chrome, Edge, Firefox và Safari mà không cần tiền tố. Dòng background đầu tiên là màu đơn, chỉ các trình duyệt rất cũ mới dùng.
Làm sọc như thế nào?
Đặt hai điểm cùng màu ở đầu và cuối mỗi sọc để màu đổi đột ngột thay vì hòa trộn, rồi bật Lặp lại. Mẫu sẵn cuối cùng là một ví dụ.
🏷️ Trình tạo meta tag
🖼️ Trình tạo Open Graph
🔗 Trình tạo liên kết UTM
🔲 Trình tạo đổ bóng CSS box-shadow