🍋 Design Tools

Generator Sistem Shadow

Generate elevation shadow systems in Material, Tailwind, or custom style

Free Hanya di browser No sign-up

Input

chars words sentences lines

Input Kedua

Opsi

Gaya bayangan

Warna bayangan (R,G,B)

Radius buram maks

Hasil

Tentang Generator Sistem Shadow

Buat sistem shadow CSS yang konsisten dari satu nilai dasar. Hasilkan 5 level elevasi dengan offset, blur, spread, dan opacity yang proporsional.

Cara Kerja

Buat 5 level shadow (sm sampai 2xl) dari parameter dasar. Setiap level meningkatkan offset-y, blur-radius, dan spread secara proporsional. Mendukung shadow berwarna, dark mode, dan output variabel CSS.

Langkah demi Langkah

1 [
2 '
3 C
4 h
5 o
6 o
7 s
8 e
9
10 a
11
12 s
13 h
14 a
15 d
16 o
17 w
18
19 s
20 t
21 y
22 l
23 e
24 :
25
26 M
27 a
28 t
29 e
30 r
31 i
32 a
33 l
34 ,
35
36 T
37 a
38 i
39 l
40 w
41 i
42 n
43 d
44 ,
45
46 o
47 r
48
49 c
50 u
51 s
52 t
53 o
54 m
55 '
56 ,
57
58 '
59 S
60 e
61 t
62
63 t
64 h
65 e
66
67 n
68 u
69 m
70 b
71 e
72 r
73
74 o
75 f
76
77 e
78 l
79 e
80 v
81 a
82 t
83 i
84 o
85 n
86
87 l
88 e
89 v
90 e
91 l
92 s
93
94 (
95 1
96 -
97 1
98 0
99 )
100 '
101 ,
102
103 '
104 C
105 u
106 s
107 t
108 o
109 m
110 i
111 z
112 e
113
114 s
115 h
116 a
117 d
118 o
119 w
120
121 c
122 o
123 l
124 o
125 r
126
127 a
128 n
129 d
130
131 m
132 a
133 x
134 i
135 m
136 u
137 m
138
139 b
140 l
141 u
142 r
143
144 (
145 f
146 o
147 r
148
149 c
150 u
151 s
152 t
153 o
154 m
155
156 s
157 t
158 y
159 l
160 e
161 )
162 '
163 ,
164
165 '
166 C
167 o
168 p
169 y
170
171 t
172 h
173 e
174
175 C
176 S
177 S
178
179 c
180 u
181 s
182 t
183 o
184 m
185
186 p
187 r
188 o
189 p
190 e
191 r
192 t
193 i
194 e
195 s
196
197 o
198 r
199
200 i
201 n
202 d
203 i
204 v
205 i
206 d
207 u
208 a
209 l
210
211 s
212 h
213 a
214 d
215 o
216 w
217
218 v
219 a
220 l
221 u
222 e
223 s
224 '
225 ]

Tips

[
'
M
a
t
e
r
i
a
l
D
e
s
i
g
n
u
s
e
s
m
u
l
t
i
-
l
a
y
e
r
s
h
a
d
o
w
s
t
h
a
t
l
o
o
k
m
o
r
e
n
a
t
u
r
a
l
'
,
"
T
a
i
l
w
i
n
d
'
s
s
h
a
d
o
w
s
c
a
l
e
(
s
m
t
o
2
x
l
)
c
o
v
e
r
s
m
o
s
t
u
s
e
c
a
s
e
s
"
,
'
U
s
e
d
a
r
k
e
r
s
h
a
d
o
w
s
s
p
a
r
i
n
g
l
y
—
s
u
b
t
l
e
s
h
a
d
o
w
s
c
r
e
a
t
e
d
e
p
t
h
w
i
t
h
o
u
t
h
e
a
v
i
n
e
s
s
'
,
'
E
x
p
o
r
t
a
s
C
S
S
c
u
s
t
o
m
p
r
o
p
e
r
t
i
e
s
t
o
m
a
i
n
t
a
i
n
c
o
n
s
i
s
t
e
n
c
y
a
c
r
o
s
s
c
o
m
p
o
n
e
n
t
s
'
]

Categories