# antd-icons-vue

> Ant Design Icons for Vue

Latest version **2.0.0** (published 2021-07-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install antd-icons-vue
pnpm add antd-icons-vue
yarn add antd-icons-vue
bun add antd-icons-vue
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 2.0.0 |
| Published | 2021-07-02 |
| First published | 2021-07-02 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 8.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1093 |
| Maintainers | kikyous |

## Links

- npm: https://www.npmjs.com/package/antd-icons-vue
- Repository: https://github.com/ant-design/ant-design-icons/tree/master/packages/icons-vue
- npm.io page: https://npm.io/package/antd-icons-vue

## Dependencies (2)

- [babel-runtime](https://npm.io/package/babel-runtime.md) ^6.26.0
- [@ant-design/colors](https://npm.io/package/@ant-design/colors.md) ^3.1.0

## Recent versions

- 2.0.0 (latest) — 2021-07-02

## README

<h1 align="center">
Ant Design Icons for Vue
</h1>

<div align="center">

[![NPM version](https://img.shields.io/npm/v/@ant-design/icons-vue.svg?style=flat)](https://npmjs.org/package/@ant-design/icons-vue)
[![NPM downloads](http://img.shields.io/npm/dm/@ant-design/icons-vue.svg?style=flat)](https://npmjs.org/package/@ant-design/icons-vue)

</div>

## Install

```bash
yarn add @ant-design/icons
yarn add @ant-design/icons-vue
```

## Basic Usage

First, you should add the icons that you need into the library.

```ts
import Vue from 'vue'
import { AntDesignOutline, DashboardOutline, TwitterOutline } from '@ant-design/icons';
import AntdIcon from '@ant-design/icons-vue';
AntdIcon.add(AntDesignOutline, DashboardOutline);
Vue.use(AntdIcon)
```

After that, you can use antd icons in your Vue components as simply as this:

```jsx
<antd-icon type="ant-design-o" />
<antd-icon type="dashboard-o" />
<antd-icon type={TwitterOutline} />
```

```ts
export interface IconDefinition {
    name: string;
    theme: ThemeType;
    icon: ((primaryColor: string, secondaryColor: string) => AbstractNode) | AbstractNode;
}
```

| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| type | Type of ant design icon | string \| IconDefinition | - |
| style | style properties of icon, like fontSize and color | object \| string | - |
| class | class properties of icon | object \| string | - |

### Events
| Events Name | Description | Arguments |
| --- | --- | --- |
| click | set the handler to handle `click` event | function(e) |

---
_Source: https://npm.io/package/antd-icons-vue · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._