phosphor-icons / phosphor-elm

A flexible icon family for Elm

phosphor-elm

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

This implementation is inspired by elm-feather.

Installation

elm install phosphor-icons/phosphor-elm

Usage

All icons have six weights; Regular, Thin, Light, Bold, Fill, and Duotone. Rendering an icon requires just a template and a weight:

import Phosphor exposing (IconWeight(..))

-- Within your view:
Phosphor.checks Bold
    |> Phosphor.toHtml []

Styling

Icons behave as text, inheriting the color and font-size from their parent. Further styling can be applied with the helpers withSize, withSizeUnit, and withClass.

Phosphor.cloud Duotone
    |> withSize 24
    |> withSizeUnit "px"
    |> withClass "custom-icon"
    |> toHtml []

By default all icons render at 1em with the class ph-icon.

Our Related Projects

• @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

Community Projects

• 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!

License

MIT © Phosphor Icons

phosphor-elm's Issues

Corrupt Package Data when downloading

Hey there, starting yesterday our local & CI installs started to fail with the following problem:

Starting downloads...

  ✗ phosphor-icons/phosphor-elm 1.0.2

Dependency problem!
-- CORRUPT PACKAGE DATA --------------------------------------------------------

I downloaded the source code for phosphor-icons/phosphor-elm 1.0.2 from:

    https://github.com/phosphor-icons/phosphor-elm/zipball/1.0.2/

But it looks like the hash of the archive has changed since publication:

  Expected: 9dcc8add1bd1b43db686c7c228764e5d03908e62
    Actual: 28db295525e42c116eda1974ce4b7e6fee451b43

This usually means that the package author moved the version tag, so report it
to them and see if that is the issue. Folks on Elm slack can probably help as
well.

Did something change with the 1.0.2 tag in this repo that caused the change?

I did some googling and saw that in the past something like this seems to have been caused by a github issue: dillonkearns/elm-graphql#581 (comment), so maybe there's nothing that can be done here. I've also asked about this on the Elm community slack