Icon

A versatile component that provides easy access to multiple icon libraries, allowing consistent and flexible use of icons throughout the interface.

Remix Icon (Outlined)

Create a Remix icon with outlined style using the ::ril() method.

Preview Code
php
Icon Libraries
The Icon component supports several icon libraries with different style variants.
  • Remix Icons: Modern and clean icon set with outline and solid styles
  • Boxicons: Simple, pixel-perfect icon set with regular, solid, and logo variants
  • Material Design Icons: Google's official icon set with regular and outlined variants
  • Bootstrap Icons: Official icons from the Bootstrap framework
Icon Examples
Here are examples of different icon libraries and styles.

Remix Icon (Solid)

Create a Remix icon with solid style using the ::ris() method.

Preview Code
php

Remix Icon (General)

Create a general Remix icon using the ::ri() method.

Preview Code
php

Boxicon (Regular)

Create a regular Boxicon using the ::bx() method.

Preview Code
php

Boxicon (Solid)

Create a solid Boxicon using the ::bxs() method.

Preview Code
php

Boxicon (Logo)

Create a Boxicon logo using the ::bxl() method.

Preview Code
php

Material Design Icon (Regular)

Create a regular Material Design icon using the ::mdi() method.

Preview Code
php

Material Design Icon with Classes

Create a Material Design icon with additional CSS classes.

Preview Code
php

Material Design Icon (Outlined)

Create an outlined Material Design icon using the ::mdo() method.

Preview Code
php

Bootstrap Icon (Regular)

Create a regular Bootstrap icon using the ::bi() method.

Preview Code
php

Bootstrap Icon (Solid)

Create a solid Bootstrap icon using the ::bis() method.

Preview Code
php

API

The Icon component provides static methods for creating icons from different libraries.
API PHP

Common alternative names: Icon Utility, Icon Factory, Icon Generator, Icon Provider, Icon Helper, Icon Toolkit, Icon Library

Types: Remix Icons, Boxicons, Material Design Icons, Bootstrap Icons

Principles

Consistency

By offering standardized methods for different icon libraries, the component ensures consistent icon usage across the application.

Flexibility

With access to multiple icon libraries and styles, developers can choose the most appropriate icon for each context.

Simplicity

The static utility approach makes it easy to create icons with minimal code, improving development efficiency.

Usage

Use icons to enhance the user interface by providing visual cues and improving comprehension. They're particularly useful for navigation elements, action buttons, status indicators, feature representations, category markers, and visual feedback.