---
name: Logo
route: /components/logo
menu: Components
---

import { Playground, PropsTable } from 'docz';
import Logo from './Logo';
import LogoIcon from './LogoIcon';

# Logo

## Usage

```javascript
import { Logo, LogoIcon } from '@snowpak/powpow';

export default () => (
  <Logo />;
);

export default () => (
  <LogoIcon>;
);
```

## Props

<PropsTable of={Logo} />

## Examples

### Logo

<Playground>
  <Logo data-cy="sp-logo" />
</Playground>

### Logo Icon

<Playground>
  <LogoIcon data-cy="sp-logoIcon" />
</Playground>

### Reversed

<Playground
  style={{
    backgroundColor: '#00b187',
  }}
>
  <Logo reversed />
</Playground>

<Playground
  style={{
    backgroundColor: '#00b187',
  }}
>
  <LogoIcon reversed />
</Playground>