Tạo CSS Box Shadow
Trình tạo box-shadow CSS với các điều khiển offset, blur, spread, màu và inset cùng bản xem trước bóng đổ. Sao chép mã CSS sẵn dùng cho mọi phần tử, miễn phí trên trình duyệt.
box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.15);Drop Shadow
Nhúng
Cap nhat lan cuoi: 2026 · Cong cu truc tuyen mien phi
Tạo CSS Box Shadow la gi?
Trình tạo box-shadow CSS với các điều khiển offset, blur, spread, màu và inset cùng bản xem trước bóng đổ. Sao chép mã CSS sẵn dùng cho mọi phần tử, miễn phí trên trình duyệt.
Cach su dung
- 1Chọn preset— Bắt đầu nhanh với nút preset.
- 2Điều chỉnh thanh trượt— Điều chỉnh bóng bằng thanh trượt offset X/Y, blur và spread.
- 3Xem trước— Kiểm tra kết quả theo thời gian thực trong bản xem trước phía trên.
- 4Sao chép CSS— Sử dụng nút sao chép để lấy CSS box-shadow.
Cong cu lien quan
Tạo CSS GradientTrình tạo gradient CSS trực quan cho gradient tuyến tính, tỏa tròn và hình nón: thêm điểm màu, chỉnh góc rồi sao chép CSS. Rất hợp cho nền và nút bấm, miễn phí trên trình duyệt.
Tạo CSS Border RadiusTrình tạo border-radius CSS với tám tay nắm góc độc lập, thanh trượt và bản xem trước trực tiếp của hình bo tròn. Sao chép mã CSS sẵn dùng cho mọi phần tử, miễn phí.
Tạo CSS FlexboxSân chơi CSS Flexbox với trình soạn trực quan cho justify-content, align-items, flex-direction và wrap kèm xem trước bố cục. Tạo mã Flexbox sẵn sao chép, miễn phí trên trình duyệt.
Bộ chuyển đổi mã màuCông cụ chuyển đổi màu giữa mã HEX, RGB, HSL và OKLCH, kèm tỉ lệ tương phản WCAG của hai màu. Kiểm tra khả năng tiếp cận ngay khi chọn bảng màu, miễn phí trên trình duyệt.
Cau hoi thuong gap
Có, sử dụng nút 'Thêm bóng' để chồng nhiều bóng lên nhau.
Có, bật hộp kiểm Inset trên mỗi bóng để tạo bóng bên trong.
Có 5 preset được cung cấp: Subtle, Medium, Large, Inset và Double.
Có, bạn có thể nhập trực tiếp rgba(0,0,0,0.15) vào trường nhập màu.
Không. Mọi tính toán đều được thực hiện trong trình duyệt.