---
title: Icon
description: ImageVector-based icons that inherit the surrounding content color by default.
---

Use icons for compact visual cues inside buttons, toolbars, menus, and status UI.

<UiDemo id="icon" />

## Installation

<Tabs>
<Tab title="Gradle">
```kotlin title="app/build.gradle.kts"
implementation("com.composables:ui:0.1.0")
```
</Tab>
<Tab title="Copy & Paste">
#### Add the required dependencies

```kotlin title="app/build.gradle.kts"
implementation("com.composables:composeunstyled:2.7.0")
```

#### Copy and paste the following sources into your project

<ComponentSource file="components/Icon.kt" />
<ComponentSource file="components/Utils.kt" />
</Tab>
</Tabs>

## Examples

### Custom tint

<UiDemo id="icon-tinted" />

### Themed

<UiDemo id="icon-themed" />

## API Reference

### Icon

An ImageVector-based icon that tints from the current content color by default.

```kotlin
@Composable
fun Icon(
    imageVector: ImageVector,
    modifier: Modifier = Modifier,
    contentDescription: String? = null,
    tint: Color = LocalContentColor.current,
)
```

| Parameter | Type | Description |
|-----------|------|-------------|
| `imageVector` | `ImageVector` | Vector asset drawn by the icon. |
| `modifier` | `Modifier` | Modifier applied to the icon. |
| `contentDescription` | `String?` | Accessible description announced for the icon. |
| `tint` | `Color` | Tint color applied to the icon. |

