# Icon
Component name: <v-icon>
# Examples
# Basic
Use the src attribute to display custom icons:
# Icons by name
Use the name attribute to display predefined icons from the design package:
# Icon + text
Use v-icon to prepend text with an icon:
# Icon sizes
# Custom sizes
Use the width attribute to display icons in custom sizes:
# Cards
# API
| Name | Type | Description | Default |
|---|---|---|---|
| name | String | Icon identifiers valid values: logo close attachment caret caret-thick check-circle search lock pin pencil download x heart eye checkmark alka play-button link star dots filter delete print house | - |
| src | String | Icon url. Valid value: Image URL | - |
| size | Number | Icon size valid values: Valid values: xxsmall xsmall small medium large | medium |
| alt | String | Alternate text | - |
General notice
All other properties that are not defined above, will be passed to the component as html attributes. This is especially useful for adding the class attribute.
← Old Hero Docs Image →