> For the complete documentation index, see [llms.txt](https://docs.shipped.club/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.shipped.club/components/features.md).

# Features

<figure><img src="/files/uxmSo27ggH5J3bYNonhy" alt=""><figcaption></figcaption></figure>

The file contains an array of features and renders them all.

```typescript
const featuresList: Omit<FeatureProps, "showCta">[] = [
  {
    category: "Productivity",
    title: "Feature 1",
    description:
      "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, diam sit amet dictum ultrices, nunc magna ullamcorper elit, vitae tincidunt nisl nunc sit amet nunc. ",
    imageUrl: "https://placehold.co/600x400",
  },
  {
    category: "Leads generation",
    title: "Feature 2",
    description:
      "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, diam sit amet dictum ultrices, nunc magna ullamcorper elit, vitae tincidunt nisl nunc sit amet nunc. ",
    imageUrl: "https://placehold.co/600x400",
  },
];
```

Component: `<Features />`

File: `src/components/Features/Features.tsx`

{% code title="page.tsx" %}

```typescript
import { Features } from "@/components/Features/Features";
```

{% endcode %}

### Props

| Prop    | Type    | Description                       |
| ------- | ------- | --------------------------------- |
| showCta | boolean | Shows or hides the call to action |

Examples

<figure><img src="/files/X8Pnm6wrqlL6nXXAmRey" alt=""><figcaption><p>userdesk.io</p></figcaption></figure>

***

{% hint style="info" %}
If you need basic components like buttons, inputs, etc, they are all available with [ChakraUI](https://chakra-ui.com/).
{% endhint %}