In build/icons.js (from the uikit repo) you just need to change the custom and match vars to:
var custom = args.c || args.custom || 'raw/assets/svgs';
var match = args.n || args.name || '([a-z]+)$';
Then throw your icons into /raw/assets/svgs/. The icon filename becomes the icon name in UIkit so lift-icon-2.svg turns into <span uk-icon="icon: lift-icon-2"></span> and it'll inject the SVG into your page as a child element to .
You don't need the .svg file to be accessible on the server; UIkit will read the .svg and put it into dist/js/uikit-icons-svgs.min.js for you.
If you add any icons that come with UIkit, you'll overwrite them. For common icon names consider prefixing them unless your intent is to overwrite.
It also looks like it'll strip your icons of any color. If you require color in an icon you can style it with the color CSS property, that works nicely. Note: using just the selector doesn't work, but every other method works.
In
build/icons.js(from the uikit repo) you just need to change thecustomandmatchvars to:Then throw your icons into /raw/assets/svgs/. The icon filename becomes the icon name in UIkit so lift-icon-2.svg turns into
<span uk-icon="icon: lift-icon-2"></span>and it'll inject the SVG into your page as a child element to .You don't need the .svg file to be accessible on the server; UIkit will read the .svg and put it into
dist/js/uikit-icons-svgs.min.jsfor you.If you add any icons that come with UIkit, you'll overwrite them. For common icon names consider prefixing them unless your intent is to overwrite.
It also looks like it'll strip your icons of any color. If you require color in an icon you can style it with the
colorCSS property, that works nicely. Note: using just the selector doesn't work, but every other method works.