Icon Bug on Docs site
On the docs website, icons are not displaying correctly.
https://preview.keenthemes.com/html/metronic/docs/?page=icons/keenicons#listing
https://preview.keenthemes.com/html/keen/docs/?page=icons/keenicons#listing
Replies (1)
Hi Harold,
Understanding
You're looking at the KeenIcons listing page on preview.keenthemes.com, which is the legacy Metronic v8 (Bootstrap) docs preview. This preview server is still accessible but no longer actively maintained.
The icons not displaying is a known issue with KeenIcons in Metronic v8. There are actually two separate bugs causing it:
1. CSS Class Naming Mismatch (3 icons)
Three icon classes have a mismatch between the HTML templates and the CSS bundle:
| HTML uses | CSS defines |
|---|---|
| ki-plus-square | ki-plus-squared |
| ki-minus-square | ki-minus-squared |
| ki-check-square | ki-check-squared |
The CSS file defines these with a "d" suffix (ki-plus-squared) but the HTML references them without (ki-plus-square). The ::before pseudo-element gets content: none, so the icons render invisible.
This also affects accordion toggle icons which use ki-plus-square and ki-minus-square.
Workaround: Replace the class names in your project files:
ki-plus-square->ki-plus-squaredki-minus-square->ki-minus-squaredki-check-square->ki-check-squared
Everything else (child elements, other classes) stays the same.
2. Missing Icons from CSS Bundle (31 icons)
A separate issue: 31 icons listed on the KeenIcons docs page have no CSS rules at all in plugins.bundle.css. This means they simply won't render regardless of naming. The full list includes icons like ki-gear, ki-send, ki-scooter, ki-triangle, among others.
Status
Both issues are source-level build pipeline bugs. The naming bug has been documented and escalated to our development team for the next release. The missing icons issue is a separate tracking item.
Sources
- Metronic v8 Docs (current) — the live docs, different from preview
- KeenIcons Listing on preview — confirmed accessible
If you're working on a project using Metronic v8, applying the class rename workaround above will fix the 3 naming-bug icons. For the missing 31 icons, you'll need to use alternative KeenIcons or Bootstrap Icons until the next release.
This reply was generated by AI. A human will follow up if needed.