# icloud-icons

## Installation

```shell
npm i @osui/icons
```

```shell
pnpm add @osui/icons
```

## Usage

```jsx
import { IconVerticalAlignTopOutlined } from '@osui/icons'

export default function Title() {
  return (
    <div className="title">
      <h1>
        Hello Icons
        <IconVerticalAlignTopOutlined style={{ color: '#999', marginLeft: 5 }} />
      </h1>
    </div>
  )
}
```

## Available Icons

<table><tbody><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/arrow-down-outlined.svg"/>
                                                        <br/><sub>IconArrowDownOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/arrow-left-outlined.svg"/>
                                                        <br/><sub>IconArrowLeftOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/arrow-up-outlined.svg"/>
                                                        <br/><sub>IconArrowUpOutlined</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/branch-dropdown.svg"/>
                                                        <br/><sub>IconBranchDropdown</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/branch-filter.svg"/>
                                                        <br/><sub>IconBranchFilter</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/caret-down-outlined.svg"/>
                                                        <br/><sub>IconCaretDownOutlined</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/caret-right-outlined.svg"/>
                                                        <br/><sub>IconCaretRightOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/check-circle-filled.svg"/>
                                                        <br/><sub>IconCheckCircleFilled</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/check-circle-outlined.svg"/>
                                                        <br/><sub>IconCheckCircleOutlined</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/check-outlined.svg"/>
                                                        <br/><sub>IconCheckOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/check-square-filled.svg"/>
                                                        <br/><sub>IconCheckSquareFilled</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/close-circle-filled.svg"/>
                                                        <br/><sub>IconCloseCircleFilled</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/close-circle-outlined.svg"/>
                                                        <br/><sub>IconCloseCircleOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/close-outlined.svg"/>
                                                        <br/><sub>IconCloseOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/down-outlined.svg"/>
                                                        <br/><sub>IconDownOutlined</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/exclamation-circle-filled.svg"/>
                                                        <br/><sub>IconExclamationCircleFilled</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/filter-outlined.svg"/>
                                                        <br/><sub>IconFilterOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/git-filter.svg"/>
                                                        <br/><sub>IconGitFilter</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/home-outlined.svg"/>
                                                        <br/><sub>IconHomeOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/info-circle-filled.svg"/>
                                                        <br/><sub>IconInfoCircleFilled</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/left-outlined.svg"/>
                                                        <br/><sub>IconLeftOutlined</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/loading-3-quarters-outlined.svg"/>
                                                        <br/><sub>IconLoading3QuartersOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/more-outlined.svg"/>
                                                        <br/><sub>IconMoreOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/plus-outlined.svg"/>
                                                        <br/><sub>IconPlusOutlined</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/right-outlined.svg"/>
                                                        <br/><sub>IconRightOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/search-outlined.svg"/>
                                                        <br/><sub>IconSearchOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/switch-cross.svg"/>
                                                        <br/><sub>IconSwitchCross</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/switch-tick.svg"/>
                                                        <br/><sub>IconSwitchTick</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/table-sort-outlined.svg"/>
                                                        <br/><sub>IconTableSortOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/up-outlined.svg"/>
                                                        <br/><sub>IconUpOutlined</sub>
                                                        </td></tr><tr><td align="center">
                                                        <img width="16" height="16" src="./svg/upload-outlined.svg"/>
                                                        <br/><sub>IconUploadOutlined</sub>
                                                        </td><td align="center">
                                                        <img width="16" height="16" src="./svg/vertical-align-top-outlined.svg"/>
                                                        <br/><sub>IconVerticalAlignTopOutlined</sub>
                                                        </td><td align="center"></td></tr></tbody></table>
