# Toolbar

```js
<SilkeToolbar>
  <SilkeSearchField label="Search" />
  <SilkeSelectField
    label="Filter"
    items={[
      { label: 'Apple', value: 'apple' },
      { label: 'Banana', value: 'banana' },
    ]}
  />
  <SilkeButton label="New project" kind="primary" />
</SilkeToolbar>
```

## Large

```js
<SilkeToolbar size="l">
  <SilkeSearchField label="Search" />
  <SilkeSelectField
    label="Filter"
    items={[
      { label: 'Apple', value: 'apple' },
      { label: 'Banana', value: 'banana' },
    ]}
  />
  <SilkeButton label="New project" kind="primary" />
</SilkeToolbar>
```

## Small

## Large

```js
<SilkeToolbar size="s">
  <SilkeSearchField label="Search" />
  <SilkeSelectField
    label="Filter"
    items={[
      { label: 'Apple', value: 'apple' },
      { label: 'Banana', value: 'banana' },
    ]}
  />
  <SilkeButton label="New project" kind="primary" />
</SilkeToolbar>
```