Trình tạo animation loading CSS
CSS Loader Generator
264 mẫu tải: 24 hình học × 11 chuyển động; lọc theo nhóm và xem hoạt ảnh.
Thiết kế
Tạo nguyên mẫu hệ thống CSS và màu sắc với bản xem trước trực tiếp và code sẵn sàng sao chép.
Công cụ
17 công cụ
Trình tạo hộp kiểm CSS
CSS Checkbox Generator
24 mẫu hộp kiểm: tám dấu × ba chuyển tiếp; thử bản xem trước gốc bằng nhấp hoặc Phím cách.
Trình tạo công tắc CSS
CSS Switch Generator
18 mẫu công tắc: sáu hình nút × ba chuyển tiếp; thử bằng nhấp hoặc bàn phím.
Trình tạo clip path CSS
CSS Clip Path Generator
24 hình cắt, tham số và điểm đa giác có thể sửa; xuất CSS hoặc một khai báo.
Trình tạo pattern nền CSS
CSS Background Pattern Generator
64 mẫu nền: 16 hình học × bốn cách xếp; chỉnh màu và kích thước ô.
Trình tạo cubic-bezier CSS
CSS Cubic Bezier Generator
Tám đường cong sẵn, bốn tọa độ Bézier và bản xem trước thời gian hoạt ảnh.
Trình tạo glassmorphism CSS
CSS Glassmorphism Generator
Điều chỉnh sắc kính, độ mờ, độ bão hòa, độ đục, bán kính và độ đục viền. Có thể đổi nền và chữ xem trước; độ rộng viền và bóng xuất ra cố định.
Trình tạo hiệu ứng glitch chữ CSS
CSS Text Glitch Effect Generator
Chỉnh chữ, cỡ chữ, màu lệch, rung và thời gian; CSS hỗ trợ giảm chuyển động.
Trình tạo gradient CSS
CSS Gradient Generator
Chuyển màu tuyến tính hoặc xuyên tâm với 2–16 điểm; thêm, xóa, đảo hoặc chọn màu ngẫu nhiên.
Trình tạo tam giác CSS
CSS Triangle Generator
Tám hướng tam giác gồm đường chéo; chỉnh kích thước và xuất HTML cùng CSS phù hợp.
Trình tạo đổ bóng CSS
CSS Box Shadow Generator
Một đến tám lớp bóng với độ lệch, nhòe, lan, màu, độ đục và inset riêng.
Trình tạo border-radius CSS
CSS Border Radius Generator
Tám bán kính ngang và dọc; xuất góc elip dưới dạng CSS sẵn sàng sao chép.
Trình tạo màu hài hòa
Color Harmony Builder
Sinh bảng năm màu từ một màu gốc theo sáu quy tắc hài hòa, với tỷ lệ tương phản theo mục tiêu 3:1, 4.5:1 hoặc 7:1. Engine xác định, xuất CSS và JSON.
HEX sang RGBA
HEX to RGBA Converter
Giải mã màu #RGB, #RGBA, #RRGGBB và #RRGGBBAA thành rgba() với alpha chính xác theo byte chia 255, kèm mẫu màu trực tiếp và từng kênh để rà soát.
RGBA sang HEX
RGBA to HEX Converter
Chuyển ký hiệu rgb() và rgba() sang HEX viết hoa, giữ độ trong suốt dưới dạng byte alpha tám chữ số khi alpha dưới 1. Kênh phần trăm bị từ chối.
Trình tạo sắc độ màu
Color Shades Generator
Bước tối và sáng riêng; xem HEX, RGBA, HSL và sao chép toàn bộ bảng màu.
Trộn màu
Color Mixer
Chọn số màu trung gian; trộn hai đầu có alpha, xem từng màu và sao chép bảng màu.
Tinh chỉnh hệ thống và giữ đầu ra tường minh.
Đặt hình học
Điều khiển khoảng cách, bán kính, hoa văn và hình dạng bằng giá trị đo được.
Mở công cụ phù hợpDựng logic màu
Pha, chuyển đổi và so sánh màu với kết quả hiển thị ngay bên cạnh.
Mở công cụ phù hợpMang code theo
Sao chép CSS và token đã tạo mà không phải dựng lại thiết kế.
Mở công cụ phù hợpƯu tiên trình duyệt, theo đúng thiết kế.
Ưu tiên trình duyệt
Mở tác vụ là dùng. Không cần gói tiện ích hay tài khoản.
Xử lý nhìn thấy được
Thấy đầu vào, kết quả, trạng thái và nhãn thực thi ở mọi bước.
Sẵn sàng xuất
Sao chép hoặc tải xuống kết quả hữu ích mà không phải dọn dẹp.
Danh mục liên quan
Tiếp tục quy trình với một bộ sưu tập tập trung khác.
Khiến mọi lựa chọn thị giác đều tái lập được.
Dùng ràng buộc có chủ đích
Bắt đầu từ quy tắc khoảng cách, tỷ lệ hoặc hình học thay vì giá trị tùy ý.
Kiểm tra độ tương phản trong ngữ cảnh
Đánh giá màu trên bề mặt và cỡ chữ nơi chúng sẽ tồn tại.
Đọc CSS đã tạo
Xác minh hỗ trợ trình duyệt và giá trị trước khi đưa đầu ra vào sản xuất.
Có câu hỏi trước khi bắt đầu?
Những công cụ nào trên trang này chạy cục bộ?
Mọi công cụ hiện được liệt kê ở đây đều xử lý đầu vào đang hoạt động trong trình duyệt của bạn, không tải lên. Bất kỳ xử lý đám mây hay kết hợp nào trong tương lai sẽ được cho biết trước khi dùng.
Chuyển đổi có làm thay đổi nguồn của tôi không?
Toolars làm việc trên một bản sao riêng trong trình duyệt. Tệp hay văn bản gốc của bạn không đổi, trừ khi bạn cố tình tải xuống và thay thế nó.
Tôi có thể lưu một công cụ không?
Có. Hãy đăng nhập trước để Toolars lưu mục yêu thích vào tài khoản của bạn và đưa bạn trở lại công cụ đó.
Làm thế nào để báo cáo kết quả sai?
Mỗi trang công cụ đều có chỗ báo cáo. Phản hồi gửi đi chỉ chứa thông điệp và ngữ cảnh trang mà bạn chọn gửi.
Còn thiếu tiện ích nào trong bộ sưu tập này?
Hãy cho chúng tôi biết đầu vào, phép chuyển đổi và kết quả bạn mong đợi.