Màu sắc & Thiết kế
Trình tạo Box Shadow
Trình tạo box-shadow CSS miễn phí. Thiết kế bóng với thanh trượt để điều chỉnh độ lệch, độ mờ, độ lan truyền, màu sắc và độ trong suốt. Xếp lớp nhiều bóng. Sao chép CSS ngay lập tức.
Runs in your browser
Box shadow generator
CSS
box-shadow: 0px 10px 30px -10px rgba(59, 130, 246, 0.40);css
Ghi chú của biên tập viên
Understanding · Five numbers. A whole light source.
Chương phân tích chuyên sâu này hiện chỉ có sẵn bằng tiếng Anh. Công cụ chuyển đổi ở trên hoạt động bằng ngôn ngữ của bạn; bài viết giải thích dài chưa được dịch.
Các câu hỏi thường gặp
Quick answers.
›Can I layer multiple shadows?
Yes — add as many shadows as you want, each with its own offset, blur, spread and color.
›Does it support inset shadows?
Yes — toggle 'inset' to make a shadow appear inside the element instead of outside.
›Does it output Tailwind?
Yes — for common single-shadow patterns. Multi-shadow stacks need custom CSS.
›Is the generator free?
Yes — fully free, no signup.
Mọi người cũng tìm kiếm
Công cụ liên quan
More in this room.
- Trình chỉnh sửa Box Shadow nâng caoXếp chồng nhiều bóng với bản xem trước trực tiếp.
- Trình tạo GradientGradient CSS tuyến tính, xuyên tâm và hình nón.
- Trình tạo Border RadiusTrình chỉnh sửa border-radius CSS từng góc.
- Trình chỉnh sửa Cubic BezierThiết kế các đường cong easing CSS trực quan.
- Trình tạo hoạt ảnh CSSTạo khung hình chính trực quan, sao chép CSS sẵn sàng dán.
- Trình tạo bộ lọc CSSXem trước trực tiếp độ mờ, độ sáng, xoay màu và hơn thế nữa.