Shadows
Shadows tokens definitions
Shadow name | Value |
---|---|
44 | 0px 16px 32px rgba(0, 0, 0, 0.2) |
43 | 0px 8px 16px rgba(0, 0, 0, 0.2) |
42 | 0px 4px 8px rgba(0, 0, 0, 0.2) |
41 | 0px 2px 4px rgba(0, 0, 0, 0.2) |
34 | 0px 0px 32px rgba(0, 0, 0, 0.2) |
33 | 0px 0px 16px rgba(0, 0, 0, 0.2) |
32 | 0px 0px 8px rgba(0, 0, 0, 0.2) |
31 | 0px 0px 4px rgba(0, 0, 0, 0.2) |
24 | 0px 16px 32px rgba(0, 0, 0, 0.1) |
23 | 0px 8px 16px rgba(0, 0, 0, 0.1) |
22 | 0px 4px 8px rgba(0, 0, 0, 0.1) |
21 | 0px 2px 4px rgba(0, 0, 0, 0.1) |
14 | 0px 0px 32px rgba(0, 0, 0, 0.1) |
13 | 0px 0px 16px rgba(0, 0, 0, 0.1) |
12 | 0px 0px 8px rgba(0, 0, 0, 0.1) |
11 | 0px 0px 4px rgba(0, 0, 0, 0.1) |
<div class="u-bs-44">Box shadow 44</div>
<div class="u-bs-43">Box shadow 43</div>
<div class="u-bs-42">Box shadow 42</div>
<div class="u-bs-41">Box shadow 41</div>
<div class="u-bs-34">Box shadow 34</div>
<div class="u-bs-33">Box shadow 33</div>
<div class="u-bs-32">Box shadow 32</div>
<div class="u-bs-31">Box shadow 31</div>
<div class="u-bs-24">Box shadow 24</div>
<div class="u-bs-23">Box shadow 23</div>
<div class="u-bs-22">Box shadow 22</div>
<div class="u-bs-21">Box shadow 21</div>
<div class="u-bs-14">Box shadow 14</div>
<div class="u-bs-13">Box shadow 13</div>
<div class="u-bs-12">Box shadow 12</div>
<div class="u-bs-11">Box shadow 11</div>
<!-- DEMO ONLY -->
<style>
body{padding:4em}
div{padding:2em;margin-bottom:4em;}
</style>