---
nav: default
---
### Icon
<img width="100" src="http://qr.topscan.com/api.php?text=demo%2F%23%2Fcomponent%2Ficon"/>
<a href="demo/#/component/icon" target="_blank" style="font-size:12px;color:#888;">demo 原始链接：demo/#/component/icon</a>


---
#### 演示
<div style="width:377px;height:667px;display:inline-block;border:1px dashed #ececec;border-radius:5px;overflow:hidden;">
<iframe src="demo/#/component/icon" width="375" height="667" border="0" frameborder="0"></iframe>
</div>
#### demo 代码

``` html
<template>
  <div>
    <box gap="10px 10px">
      <icon type="success" />
      <icon type="info" />
      <icon type="info_circle" />
      <icon type="warn" />
      <icon type="waiting" />
      <icon type="waiting_circle" />
      <icon type="safe_success" />
      <icon type="safe_warn" />
      <icon type="success_circle" />
      <icon type="success_no_circle" />
      <icon type="circle" />
      <icon type="download" />
      <icon type="cancel" />
      <icon type="search" />
      <icon type="clear" />
      <br>
      <icon
        type="success"
        class="icon_big"
      />
      <icon
        type="info"
        class="icon_big"
      />
      <icon
        type="safe_success"
        class="icon_big"
      />
      <icon
        type="safe_warn"
        class="icon_big"
      />
    </box>
  </div>
</template>

<script>
import { Box, Icon } from '../components/_index'

export default {
  components: {
    Box,
    Icon
  }
}
</script>

```

#### Github Issue