Phosphor is a flexible icon family for interfaces, diagrams, presentations — whatever, really. Explore all our icons at phosphoricons.com.

Add this repo as a new Package Dependency with File > Add Package Dependencies... and enter this URL in the search bar:

https://github.com/phosphor-icons/swift

Choose appropriate version ranges, or use the main branch for the most recent version.

All icons are present on the Ph enum as computed properties that return a SwiftUI Image, plus some special sauce. To render an icon, use the computed weight property on the enum member, i.e. Ph.<name>.<weight>:

import SwiftUI
import PhosphorSwift

struct ContentView: View {
    var body: some View {
        HStack {
            Ph.horse.regular
                .color(.accentColor)
                .frame(width: 64, height: 64)
            Ph.heart.fill
                .color(.red)
                .frame(width: 64, height: 64)
            Ph.cube.duotone
                .frame(width: 64, height: 64)
        }   
    }
}

Color can be applied with the .color(_: Color) modifier, which at present is simply a View extension which applies a ViewModifier to any view, causing a color mask to be applied to that view's non-transparent elements.

If weight is dynamic, you can use the .weight(_: Ph.IconWeight) method to render a weight that is not known at compile time, or to use different weights as states (e.g. active/inactive).

• @phosphor-icons/homepage ▲ Phosphor homepage and general info
• @phosphor-icons/core ▲ Phosphor icon assets and catalog
• @phosphor-icons/react ▲ Phosphor icon component library for React
• @phosphor-icons/web ▲ Phosphor icons for Vanilla JS
• @phosphor-icons/vue ▲ Phosphor icon component library for Vue
• @phosphor-icons/swift ▲ Phosphor icon component library for SwiftUI
• @phosphor-icons/elm ▲ Phosphor icons for Elm
• @phosphor-icons/flutter ▲ Phosphor IconData library for Flutter
• @phosphor-icons/webcomponents ▲ Phosphor icons as Web Components
• @phosphor-icons/figma ▲ Phosphor icons Figma plugin
• @phosphor-icons/sketch ▲ Phosphor icons Sketch plugin
• @phosphor-icons/pack ▲ Phosphor web font stripper to generate minimal icon bundles
• @phosphor-icons/theme ▲ A VS Code (and other IDE) theme with the Phosphor color palette

• phosphor-react-native ▲ Phosphor icon component library for React Native
• phosphor-svelte ▲ Phosphor icons for Svelte apps
• phosphor-r ▲ Phosphor icon wrapper for R documents and applications
• blade-phosphor-icons ▲ Phosphor icons in your Laravel Blade views
• wireui/phosphoricons ▲ Phosphor icons for Laravel
• phosphor-css ▲ CSS wrapper for Phosphor SVG icons
• ruby-phosphor-icons ▲ Phosphor icons for Ruby and Rails applications
• eleventy-plugin-phosphoricons ▲ An Eleventy plugin for add shortcode, allows Phosphor icons to be embedded as inline svg into templates
• phosphor-leptos ▲ Phosphor icon component library for Leptos apps (rust)
• wordpress-phosphor-icons-block ▲ Phosphor icon block for use in WordPress v5.8+
• ember-phosphor-icons ▲ Phosphor icons for Ember apps

If you've made a port of Phosphor and you want to see it here, just open a PR here!

MIT © Phosphor Icons