Metronic 8.3.3 Bootstrap Laravel

Hi Llister,

Understanding

You're on Metronic v8.3.3 (Bootstrap) with Laravel, and the KeenIcons are rendering the wrong glyphs — ki-plus shows a crown instead of a plus sign. Note this is different from icons being invisible or missing: when every icon shows a different icon than expected, it means the icon font file and the CSS don't match each other's version.

Solution

KeenIcons works by mapping each CSS class to a codepoint, and the font file renders whatever glyph sits at that codepoint. The v8.3.3 package ships the CSS and the fonts as a matched pair (ki-plus is correctly a plus sign in the package). When the font files and the CSS come from different Metronic/KeenIcons versions, every icon shifts to the wrong glyph — which matches what you're seeing.

1. Verify which font is loading. Open DevTools → Network → reload the page → filter by keenicons. The font request (keenicons-duotone.woff2 / .ttf) should return 200 and point to your project's asset path (in the Laravel starter kit: public/assets/plugins/global/fonts/).
2. Re-copy ALL KeenIcons files from the same v8.3.3 package. Copy the complete plugins.bundle.css and all four font families (duotone, solid, outline, filled) together — don't mix files from the HTML demo package with the Laravel package, and don't copy only some of the files.
3. Delete the old font files first. Leftover fonts with the same filenames survive partial overwrites and are the #1 cause of this. Remove the old keenicons-* files, then copy the fresh ones in.
4. Clear the browser cache and hard refresh (Cmd+Shift+R on Mac / Ctrl+F5 on Windows). A stale cached font is a very common cause right after an update.
5. If icons are invisible (not wrong) instead — that's the separate known v8 issue where ki-plus-square / ki-minus-square / ki-check-square don't match the CSS classes (ki-plus-squared, etc.). Rebuilding your assets, or using the -squared class names, fixes that one.

Sources

• Metronic v8 Documentation

Next Steps

If the icons are still wrong after re-copying the fonts and clearing the cache, reply with the DevTools Network output for the keenicons font request (full URL + status code). That will tell us exactly which file is stale so we can pinpoint it. If it turns out the prebuilt bundle in your starter kit is out of sync, I'll escalate it to the team for a package fix.

This reply was generated by AI. A human will follow up if needed.