Miễn Phí Online Tạo bóng & lưới CSS

Thiết kế CSS trực quan thay vì đoán các con số. Ở chế độ Box, kéo thanh trượt để chỉnh độ lệch bóng, độ nhòe, độ lan, bán kính bo góc, màu và độ mờ, kèm tùy chọn bóng inset, và xem bản xem trước cập nhật trực tiếp. Ở chế độ Grid, đặt số cột, khoảng cách, số mục và chiều cao hàng để dàn một lưới responsive. CSS tương ứng được tạo ngay khi bạn thao tác — sao chép thẳng vào stylesheet của bạn. Mọi thứ chạy trong trình duyệt của bạn.

🔒 Xử lý tại máy 🆓 Miễn phí mãi mãi ⚡ Ngay lập tức

Đang tải công cụ…

Cách dùng Tạo bóng & lưới CSS

  1. Chọn Box shadow & bo góc hoặc Bố cục lưới.
  2. Kéo thanh trượt để tạo hình hiệu ứng.
  3. Xem bản xem trước và CSS cập nhật trực tiếp.
  4. Sao chép CSS đã tạo vào dự án của bạn.

Thắc mắc về Tạo bóng & lưới CSS

Công cụ tạo ra CSS nào?

CSS chuẩn, sẵn sàng sao chép: một quy tắc .box với background, border-radius và box-shadow, hoặc một quy tắc .grid dùng display:grid với grid-template-columns và gap. Không cần tiền tố vendor cho các thuộc tính này trên trình duyệt hiện đại.

Tôi có thể dùng CSS lưới cho một trang web thật không?

Có. Quy tắc lưới dùng repeat() và các cột phân số, nên nó responsive. Hãy dán nó vào stylesheet và đặt nội dung của bạn bên trong vùng chứa lưới.

Về Tạo bóng & lưới CSS

Tạo bóng đổ và bố cục lưới bằng mã CSS trực quan với công cụ online miễn phí Tạo bóng & lưới CSS. 100% trên trình duyệt, không đăng nhập hay tải tệp lên.

Các công cụ văn bản và mã này dọn và biến đổi chuỗi: đếm từ, đổi hoa thường, bỏ dòng trùng, mã hóa/giải mã Base64 và URL, escape thực thể, băm, định dạng JSON và so sánh hai bản.

Công cụ chạy trong trình duyệt. Tệp không được tải lên. Mọi thứ chạy trên văn bản bạn dán, nên có thể xử lý an toàn các đoạn mã hoặc log; không gửi đi đâu, và xóa ô nhập sẽ gỡ nó khỏi bộ nhớ.

Tất cả công cụ