Trình tạo CSS Box Shadow

Một khai báo box-shadow có sáu thành phần chuyển động — độ lệch X và Y, độ nhòe, độ lan, màu sắc và từ khóa inset tùy chọn — và cách duy nhất để làm đúng là nhìn thấy chúng. Trình tạo này đặt mỗi phần lên một thanh trượt và hiển thị kết quả trên một thẻ xem trước khi bạn kéo, vì vậy dòng CSS ở dưới cùng luôn chính xác là những gì bạn đang thấy.

Bóng trong thực tế hiếm khi chỉ có một lớp. Danh sách lớp cho phép bạn xếp chồng tối đa bốn bóng trong một khai báo: một đường tối sắc nét để tạo nét cạnh cộng với một lớp mềm rộng để tạo độ nâng, hoặc cặp sáng-tối định nghĩa phong cách neumorphism. Chọn một lớp để chỉnh sửa, xóa những lớp không cần thiết, và giá trị box-shadow tổng hợp cập nhật trực tiếp.

Bóng đổ trông rất khác trên các giao diện tối, nơi mà một bóng đen trên trang gần như đen đơn giản là biến mất. Nút chuyển đổi nền xem trước thay đổi phông nền giữa sáng và tối để bạn có thể kiểm tra cả hai giao diện trước khi xuất bản. Các trang cài sẵn bao gồm những biến thể mà mọi người thường thực sự tìm kiếm: bóng nâng mềm mại, hiệu ứng lõm bên trong, công thức hai lớp neumorphism và bóng thẻ tinh tế.

Giống như mọi công cụ trên trang này, trình tạo này miễn phí và chạy hoàn toàn trong trình duyệt của bạn: không tải lên, không cần tài khoản và vẫn hoạt động ngoại tuyến sau khi trang đã tải xong.