@neo4j-ndl/react/skills/ndl-react/components/logo.md

React implementation of Neo4j Design System

# Logo

Import: `import { Logo } from '@neo4j-ndl/react'`

## Props

### Logo

| Prop | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `color` | `'black' \| 'color' \| 'white'` |  |  |  |
| `ref` | `Ref<SVGSVGElement>` |  |  | A ref to apply to the root element. |
| `type` | `'full' \| 'icon'` |  | `full` |  |

## Examples

### Default

```tsx
import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';

import { Logo } from '@neo4j-ndl/react';

const Component = () => {
  return <Logo className="n-w-24" />;
};

export default Component;
```

### Black

```tsx
import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';

import { Logo } from '@neo4j-ndl/react';

const Component = () => {
  return <Logo className="n-w-24" color="black" />;
};

export default Component;
```

### Icon

```tsx
import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';

import { Logo } from '@neo4j-ndl/react';

const Component = () => {
  return <Logo className="n-w-24" type="icon" />;
};

export default Component;
```