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)
}
}
}
Note
By default, all icon images are .resizable()
and rendered with .interpolation(Image.Interpolation.medium)
for scalable, antialiased icons at any size, without much overhead. The frame can be sized manually, or an icon will fit the size of its parent frame – though it is recommended to use .aspectRatio(contentMode: .fit)
to retain the icon's original (square) aspect ratio in this case.
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/elm ▲ Phosphor icons for Elm
- @phosphor-icons/figma ▲ Phosphor icons Figma plugin
- @phosphor-icons/flutter ▲ Phosphor IconData library for Flutter
- @phosphor-icons/pack ▲ Phosphor web font stripper to generate minimal icon bundles
- @phosphor-icons/penpot ▲ Phosphor icons Penpot plugin
- @phosphor-icons/react ▲ Phosphor icon component library for React
- @phosphor-icons/sketch ▲ Phosphor icons Sketch plugin
- @phosphor-icons/swift ▲ Phosphor icon component library for SwiftUI
- @phosphor-icons/theme ▲ A VS Code (and other IDE) theme with the Phosphor color palette
- @phosphor-icons/unplugin ▲ A multi-framework bundler plugin for generating Phosphor sprite sheets
- @phosphor-icons/vue ▲ Phosphor icon component library for Vue
- @phosphor-icons/web ▲ Phosphor icons for Vanilla JS
- @phosphor-icons/webcomponents ▲ Phosphor icons as Web Components
- adamglin0/compose-phosphor-icons ▲ Phosphor icons for Compose Multiplatform
- brettkolodny/phosphor-lustre ▲ Phosphor icons for Lustre
- cjohansen/phosphor-clj ▲ Phosphor icons as Hiccup for Clojure and ClojureScript
- codeat3/blade-phosphor-icons ▲ Phosphor icons in your Laravel Blade views
- dreamRs/phosphor-r ▲ Phosphor icon wrapper for R documents and applications
- duongdev/phosphor-react-native ▲ Phosphor icon component library for React Native
- haruaki07/phosphor-svelte ▲ Phosphor icons for Svelte apps
- IgnaceMaes/ember-phosphor-icons ▲ Phosphor icons for Ember apps
- lucagoslar/phosphor-css ▲ CSS wrapper for Phosphor SVG icons
- maful/ruby-phosphor-icons ▲ Phosphor icons for Ruby and Rails applications
- meadowsys/phosphor-svgs ▲ Phosphor icons as Rust string constants
- mwood/tamagui-phosphor-icons ▲ Phosphor icons for Tamagui
- oyedejioyewole/nuxt-phosphor-icons ▲ Phosphor icons integration for Nuxt
- pepaslabs/phosphor-uikit ▲ Xcode asset catalog generator for Swift/UIKit
- raycast/phosphor-icons ▲ Phosphor icons Raycast extension
- reatlat/eleventy-plugin-phosphoricons ▲ An Eleventy shortcode plugin to embed icons as inline SVGs
- robruiz/wordpress-phosphor-icons-block ▲ Phosphor icon block for use in WordPress v5.8+
- sachaw/solid-phosphor ▲ Phosphor icons for SolidJS
- SeanMcP/phosphor-astro ▲ Phosphor icons as Astro components
- SorenHolstHansen/phosphor-leptos ▲ Phosphor icon component library for Leptos apps (rust)
- vnphanquang/phosphor-icons-tailwindcss ▲ TailwindCSS plugin for Phosphor icons
- wireui/phosphoricons ▲ Phosphor icons for Laravel
If you've made a port of Phosphor and you want to see it here, just open a PR here!
MIT © Phosphor Icons