---
title: "Shadow — React"
canonical: https://sky-ui.cf.sky.com/foundations/shadow/react
apiPackages: [{"name":"@sky-uk/ui-core","representedVersion":"13.2.0"}]
---

# Shadow — React

Different levels of elevation for static and selectable elements.

```js
import { shadow } from '@sky-uk/ui-core';

shadow(1);
// returns
`0 6px 15px 0 rgba(0, 0, 0, 0.15)`;
```

---

## Available Shadow Units

| Shadow Unit | Value |
| --- | --- |
| 0 | 0 |
| 1 | 0 2px 8px 0 rgba(0,0,0,0.25) |
| 2 | 0 6px 15px 0 rgba(0,0,0,0.15) |
| 3 | 0 10px 15px 0 rgba(0,0,0,0.20) |
| 4 | 0px 24px 38px rgba(0, 0, 0, 0.05),<br><br>0px 9px 46px rgba(0, 0, 0, 0.12),<br><br>0px 11px 15px rgba(0, 0, 0, 0.2) |