The Beron theme utilizes TablerIcon and custom Beronicon icons to enhance the visual experience. You can manually use these icons by referencing the resources below.

1. Using Remixicon Icons

You can explore and use TablerIcon icons from their official website:
🔗 tablericon Website

Example Usage in HTML:

<i class="ti ti-12-hours"></i> 12 Hours  
<i class="ti ti-123"></i> 123  
<i class="ti ti-24-hours"></i> 24 Hours  
<i class="ti ti-2fa"></i> 2fa  

2. Using Custom FlatIcon Icons

Below is a list of custom FlatIcon icons used in the Mavis theme, along with examples of how to use them in HTML.

Navigation & UI Icons

<i class="beronicon-passport-4"></i> Passport  
<i class="beronicon-passport"></i> Passport Two  
<i class="beronicon-passport-2"></i> Passport Three  
<i class="beronicon-passport-5"></i> Passport Four  
<i class="beronicon-passport-3"></i> Passport Five  
<i class="beronicon-briefcase"></i> Briefcase  
<i class="beronicon-visa"></i> Visa  

How to Use Icons in Your Website?

1. Ensure your theme includes TablerIcon and Beronicon stylesheets (usually loaded by the theme automatically).
2. Use the <i> tag with the corresponding class name to display an icon.
3. Style icons using CSS if needed for size, color, or positioning.

Example with Custom Styling:

<i class="beronicon-passport" style="font-size: 24px; color: #007bff;"></i> Passport Two

This will display a Passport Two icon with a font size of 24px and a blue color.

Final Notes

• TablerIcon icons can be directly referenced using their class names.
• Beronicon icons are preloaded in the theme and can be used by adding the corresponding class.
• You can customize the icons using CSS for size, spacing, and color adjustments.