# Integration Cards

> Render integration, partner, or stack cards.

Canonical HTML: https://press.varavel.com/docs/shortcodes/integration-cards/
Markdown: https://press.varavel.com/docs/shortcodes/integration-cards/index.md

`integration_cards` renders linked or static cards for tools, platforms, and ecosystem integrations.

## When to Use

Use it to show compatible tools, deployment targets, data sources, or technical stack components.

## Usage

```markdown
{{/* integration_cards(title="Works with", item_1_icon="github", item_1_name="GitHub") */}}
```

## Live Example

{{ integration_cards(
container="md",
title="Works with your stack",
description="Show integrations without leaving the monochrome design system.",
item_1_icon="github",
item_1_name="GitHub",
item_1_desc="Source control and workflows.",
item_1_status="Native",
item_2_icon="terminal",
item_2_name="CLI",
item_2_desc="Local-first build commands.",
item_2_status="Built in",
item_3_icon="globe",
item_3_name="Static hosts",
item_3_desc="Deploy anywhere static files work.",
item_3_status="Portable"
) }}

## Parameters

| Parameter       | Description                                  |
| --------------- | -------------------------------------------- |
| `container`     | Inner content width.                         |
| `eyebrow`       | Small uppercase label above the heading.     |
| `title`         | Section heading.                             |
| `description`   | Supporting copy.                             |
| `columns`       | Desktop columns. Use `2` or `3`.             |
| `item_N_icon`   | Optional icon name.                          |
| `item_N_name`   | Integration name, up to 6.                   |
| `item_N_desc`   | Integration description.                     |
| `item_N_status` | Optional status badge.                       |
| `item_N_href`   | Optional card URL.                           |
| `bg`            | Full-width section background token.         |
| `class`         | Additional CSS classes on the outer section. |