SVG framework function: getIcon
This tutorial is part of Iconify SVG Framework functions tutorial.
The function getIcon() retrieves icon data.
Usage
The function has the following parameter:
- name, string. Icon name.
The function returns icon data in IconifyIcon format, null if icon is not available.
Examples
js
const data = Iconify.getIcon('bi:check2-circle');
Result:
json
{
"body": "<g fill=\"currentColor\"><path fill-rule=\"evenodd\" d=\"M15.354 2.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3-3a.5.5 0 1 1 .708-.708L8 9.293l6.646-6.647a.5.5 0 0 1 .708 0z\"/><path fill-rule=\"evenodd\" d=\"M8 2.5A5.5 5.5 0 1 0 13.5 8a.5.5 0 0 1 1 0a6.5 6.5 0 1 1-3.25-5.63a.5.5 0 1 1-.5.865A5.472 5.472 0 0 0 8 2.5z\"/></g>",
"left": 0,
"top": 0,
"width": 16,
"height": 16,
"rotate": 0,
"vFlip": false,
"hFlip": false
}
Another example:
js
const data = Iconify.getIcon('cil:paper-plane');
Result:
json
{
"body": "<path fill=\"currentColor\" d=\"M474.444 19.857a20.336 20.336 0 0 0-21.592-2.781L33.737 213.8v38.066l176.037 70.414L322.69 496h38.074l120.3-455.4a20.342 20.342 0 0 0-6.62-20.743zM337.257 459.693L240.2 310.37l149.353-163.582l-23.631-21.576L215.4 290.069L70.257 232.012L443.7 56.72z\"/>",
"left": 0,
"top": 0,
"width": 512,
"height": 512,
"rotate": 0,
"vFlip": false,
"hFlip": false
}
Example with bad icon name, returns null:
js
// null
const data = Iconify.getIcon('no-such-icon');