Phosphor Svelte screenshot

Phosphor Svelte

Author Avatar Theme by Haruaki07
Updated: 12 Jan 2026
239 Stars

A clean and friendly icon family for Svelte

Overview:

Phosphor is a versatile icon family that can be used in various interfaces, diagrams, and presentations. It offers a wide range of icons that can be customized to fit different styles and design needs.

Features:

  • Flexible Icon Family: Phosphor provides a wide array of icons that can be used in different contexts and applications.
  • Customizable Styles: Users can easily modify the color, size, weight, and mirroring of icons to match their design preferences.
  • Composability: Icons can be composed with other SVG elements, allowing for the addition of background layers, shapes, filters, animations, and more.

Installation:

To install Phosphor, follow these steps:

  1. Include the Phosphor package in your project dependencies:
npm install phosphor-svelte
  1. Import the desired icons into your project:
import { IconName } from 'phosphor-svelte';
  1. Use the imported icons in your code:
<IconName />
  1. Customize the icon’s props as needed:
<IconName color="blue" size={24} />

Summary:

Phosphor is a flexible icon family that provides a wide range of customizable icons for interfaces, diagrams, presentations, and more. Its key features include flexibility in design, customizable styles, and the ability to compose icons with other SVG elements. With easy installation and usage, Phosphor is a valuable resource for designers and developers looking to enhance their projects with visually appealing icons.