Create and customize CSS box-shadow values with real-time preview
A CSS box-shadow generator is a visual tool that lets you create shadow effects for HTML elements without hand-coding CSS values. Adjust horizontal and vertical offset, blur radius, spread radius, shadow color, and opacity using intuitive sliders and see changes in real time.
This free online tool supports up to five independent shadow layers, allowing you to build sophisticated layered effects like the popular soft UI or neumorphic styles. Toggle inset mode to create inner shadows. Switch between light and dark backgrounds to preview how your shadow looks in different contexts.
Eight built-in presets including Subtle, Heavy, Layered, and Glow give you a head start. When you are done, copy the generated CSS with one click and paste it directly into your stylesheet. Everything runs in your browser with no sign-up or installation needed.
CSSボックスシャドウジェネレーターは、スライダーでオフセット・ぼかし・拡散・色・透明度を調整し、リアルタイムでプレビューできる無料オンラインツールです。最大5レイヤーの影を重ね、insetモードや8種類のプリセットにも対応しています。
CSS 박스 그림자 생성기는 슬라이더로 오프셋, 흐림, 확산, 색상, 불투명도를 조절하며 실시간 미리보기를 제공하는 무료 온라인 도구입니다. 최대 5개의 그림자 레이어와 inset 모드, 8가지 프리셋을 지원합니다.
CSS盒阴影生成器通过滑块调整偏移量、模糊、扩展、颜色和透明度，并实时预览效果。支持最多5个阴影图层、inset模式和8种预设，一键复制生成的CSS代码。
CSS盒陰影生成器透過滑桿調整偏移量、模糊、擴展、顏色和透明度，並即時預覽效果。支援最多5個陰影圖層、inset模式和8種預設，一鍵複製產生的CSS程式碼。
Un generador de sombras CSS permite crear efectos de sombra visualmente con controles deslizantes para desplazamiento, desenfoque, expansión, color y opacidad. Soporta hasta 5 capas de sombra, modo inset y 8 presets integrados.
Un générateur d'ombres CSS permet de créer des effets d'ombre visuellement avec des curseurs pour le décalage, le flou, l'étendue, la couleur et l'opacité. Il supporte jusqu'à 5 couches d'ombre, le mode inset et 8 préréglages intégrés.
Ein CSS-Box-Shadow-Generator erstellt Schatteneffekte visuell mit Schiebereglern für Versatz, Unschärfe, Ausbreitung, Farbe und Deckkraft. Er unterstützt bis zu 5 Schattenebenen, den Inset-Modus und 8 integrierte Voreinstellungen.
Генератор CSS box-shadow позволяет визуально создавать эффекты теней с помощью ползунков для смещения, размытия, распространения, цвета и прозрачности. Поддерживает до 5 слоёв теней, режим inset и 8 встроенных пресетов.
Генератор CSS box-shadow дозволяє візуально створювати ефекти тіней за допомогою повзунків для зміщення, розмиття, розповсюдження, кольору та прозорості. Підтримує до 5 шарів тіней, режим inset та 8 вбудованих пресетів.
Trình tạo bóng hộp CSS cho phép tạo hiệu ứng bóng trực quan bằng thanh trượt điều chỉnh offset, blur, spread, màu sắc và độ mờ. Hỗ trợ tối đa 5 lớp bóng, chế độ inset và 8 preset có sẵn.
مولّد ظل الصندوق CSS يتيح إنشاء تأثيرات الظل بصريًا باستخدام أشرطة تمرير للإزاحة والتمويه والانتشار واللون والشفافية. يدعم حتى 5 طبقات ظل ووضع inset و8 إعدادات مسبقة مدمجة.