Sponsor View on GitHub
Documentation

API Reference

This page documents all props and options available for Hovue icons. All icons share the same API for consistency.

Props

size

Type: number | string

Default: 24

Description: The size of the icon in pixels.

<HoArrowRight :size="24" />

color

Type: string

Default: "currentColor"

Description: The color of the icon. Accepts any valid CSS color value.

<HoArrowRight color="#319795" />
<HoArrowRight color="rgb(49, 151, 149)" />
<HoArrowRight color="currentColor" />

animation

Type: "slide" | "bounce" | "rotate" | "pulse" | "fade" | "none"

Default: "none"

Description: The animation type to apply to the icon.

<HoArrowRight animation="slide" />

animationDuration

Type: number

Default: 300

Description: The duration of the animation in milliseconds.

<HoArrowRight :animation-duration="500" />

strokeWidth

Type: number

Default: 2

Description: The stroke width of the icon.

<HoArrowRight :stroke-width="1.5" />

Events

@click

Type: MouseEvent

Description: Emitted when the icon is clicked.

<HoArrowRight @click="handleClick" />

@hover

Type: MouseEvent

Description: Emitted when the mouse enters the icon.

<HoArrowRight @hover="handleHover" />

TypeScript

All icons are fully typed. Import the types you need:

import type { IconProps } from 'hovue'

Available Icons

Hovue includes 100+ icons. Here are the main categories:

Arrows

  • HoArrowRight
  • HoArrowLeft
  • HoArrowUp
  • HoArrowDown
  • HoChevronRight
  • HoChevronDown

Actions

  • HoCheck
  • HoX
  • HoPlus
  • HoMinus
  • HoSearch
  • HoMenu

UI Elements

  • HoHome
  • HoUser
  • HoSettings
  • HoBell
  • HoMail
  • HoHeart

Media

  • HoPlay
  • HoPause
  • HoVolume
  • HoCamera
  • HoImage
  • HoMusic

Files

  • HoFile
  • HoFolder
  • HoCopy
  • HoTrash
  • HoDownload
  • HoUpload

Loaders

  • HoLoader
  • HoRefresh
  • HoSync
  • HoClock
  • HoCalendar
  • HoStar

See the Examples Gallery for code examples of all icons.