Soft CSS Box Shadow - Mã được tạo sẵn
Xây dựng mã bóng hộp CSS một cách trực quan: các thanh trượt để bù, làm mờ, trải rộng, màu sắc với độ mờ, chế độ chèn và tối đa bốn lớp với bản xem trước trực tiếp.
kết quả
Trang này mở trình tạo bóng hộp được tải sẵn với bóng mềm: không có độ lệch ngang, giảm 8px, độ mờ rộng 24px và độ mờ đen thấp 12%. Thẻ xem trước hiển thị thẻ ngay lập tức — di chuyển bất kỳ thanh trượt nào và dòng CSS sẽ xuất hiện theo thời gian thực.
Bóng mềm là đặc trưng của giao diện hiện đại. Một vết mờ lớn kết hợp với độ mờ thấp sẽ nâng tấm thẻ ra khỏi trang mà không vẽ đường viền cứng, đó là lý do tại sao hầu hết các hệ thống thiết kế giữ bóng độ cao của chúng trong phạm vi chính xác này thay vì bóng tối dày đặc của thiết kế phẳng ban đầu.
Sao chép thẳng đường bóng hộp vào biểu định kiểu của bạn hoặc xếp chồng tối đa ba lớp nữa để có độ cao phong phú hơn. Trình tạo chạy hoàn toàn trong trình duyệt của bạn - không có gì được tải lên ở bất kỳ đâu.