Icon
Default use:
vue
<h-icon icon="fas fa-home" />
Colors:
vue
<h-icon color="inherit" icon="fas fa-home" />
<h-icon color="primary" icon="fas fa-home" />
<h-icon color="secondary" icon="fas fa-home" />
<h-icon color="interactive" icon="fas fa-home" />
<h-icon color="grey" icon="fas fa-home" />
<h-icon color="success" icon="fas fa-home" />
<h-icon color="danger" icon="fas fa-home" />
<h-icon color="warn" icon="fas fa-home" />
<h-icon color="info" icon="fas fa-home" />
<h-icon color="inverse" icon="fas fa-home" />
With size:
vue
<h-icon icon="fas fa-home" size="medium" />
<h-icon icon="fas fa-home" size="large" />
<h-icon icon="fas fa-home" size="extra-large" />
<h-icon icon="fas fa-home" size="jumbo" />
<h-icon icon="fas fa-home" size="extra-jumbo" />
<h-icon icon="fas fa-home" size="giant" />
<h-icon icon="fas fa-home" size="extra-giant" />
<h-icon icon="fas fa-home" size="colossal" />
<h-icon icon="fas fa-home" size="extra-colossal" />
<h-icon icon="fas fa-home" size="mega" />
<h-icon icon="fas fa-home" size="extra-mega" />
<h-icon icon="fas fa-home" size="immense" />
With animation:
vue
<h-icon size="medium" icon="fas fa-spinner fa-spin" />
<h-icon size="medium" icon="fas fa-circle-notch fa-spin" />
<h-icon size="medium" icon="fas fa-sync fa-spin" />
<h-icon size="medium" icon="fas fa-cog fa-spin" />
<h-icon size="medium" icon="fas fa-spinner fa-pulse" />
<h-icon size="medium" icon="fas fa-stroopwafel fa-spin" />
Bounds:
vue
<h-icon color="inverse" icon="fas fa-home" bounds="circle" />
<h-icon color="inverse" icon="fas fa-home" bounds="rounded" />
<h-icon color="inverse" icon="fas fa-home" bounds="square" />