Bộ tạo Flexbox CSS
Tạo các bố cục CSS bằng flexbox một cách trực quan. Xem kết quả theo thời gian thực trong khi bạn điều chỉnh hướng, căn chỉnh, ngắt dòng và khoảng cách.
display: flex; flex-direction: row; justify-content: flex-start; align-items: stretch; flex-wrap: nowrap; gap: 8px;
Bộ tạo Flexbox CSS là gì?
Flexbox là cách hiện đại để sắp xếp các phần tử trong CSS, đơn giản hơn nhiều so với float hay định vị tuyệt đối. Các thuộc tính gồm: flex-direction (hàng hoặc cột), justify-content (căn chỉnh trên trục chính), align-items (trục ngang), flex-wrap và gap. Công cụ này phơi bày tất cả chúng kèm theo bản xem trước theo thời gian thực.
Câu hỏi thường gặp
Flexbox hay Grid?▼
Công cụ liên quan
Trình chuyển đổi màu (HEX/RGB/HSL)
Chuyển đổi màu giữa các định dạng HEX, RGB và HSL. Chọn màu trực quan hoặc nhập các giá trị thủ công.
Trình tạo Box Shadow CSS
Tạo các giá trị box-shadow trong CSS một cách trực quan. Xem trước theo thời gian thực và sao chép CSS được tạo ra.
Bộ tạo dải màu chuyển sắc CSS
Tạo các dải màu chuyển sắc CSS dạng tuyến tính và tỏa tròn. Chọn màu một cách trực quan và sao chép đoạn CSS được tạo ra.
Bộ tạo đường cong gia tốc Cubic Bezier
Tạo các đường cong gia tốc cubic-bezier cho CSS. Bao gồm các giá trị cài sẵn theo chuẩn.
Trình tạo bảng màu
Tạo các bảng màu hài hòa từ bất kỳ màu cơ sở nào. Hỗ trợ các sơ đồ màu bổ túc, tương đồng, bộ ba và đơn sắc.
Trình tạo Border Radius CSS
Tạo các giá trị border-radius phức tạp trong CSS một cách trực quan. Kiểm soát độc lập từng góc.