Herman Icons
Herman doesn’t use very many icons internally…
Icon Previews assets/svg/
macro icon()
Icons should be added to the html using our
icon() utility macro in Nunjucks.
name:: {string}
The string ID used to identify the icon desired.alt=none:: {string|none}
Alternate text for the icon will be visually hidden, but available to screen-readers.size=none:: {string|none}
Currently supported icon sizes include'nav-icon'and'footer-logo'.class=none:: {string|none}
Any classes that should be applied to the icon.
Example
njk
{% import 'utility.macros.njk' as utility %}
{{ utility.icon('menu', size='nav-icon') }}
html
compiled
<svg data-icon="menu" data-icon-size="nav-icon">
<use xlink:href="#icon-menu" />
</svg>[data-icon]
scss
[data-icon] {
@include tools.square(1em);
fill: currentcolor;
}Icons inherit the color of their surroundings,
and default to a 1em square if no other dimensions are provided.