Orasund / elm-ui-widgets / Widget.Icon

This module ensures that every icon package on package.elm-lang.org is supported.

Just look for the function with the name of the package and copy&paste the respective example.


type alias IconStyle =
{ size : Basics.Int
, color : Color 
}


type alias Icon msg =
{ size : Basics.Int
, color : Color } -> Element ms
}

antDesignIconsElm : (List (Svg.Attribute msg) -> Html msg) -> Icon msg

For using lemol/ant-design-icons-elm

import Ant.Icons.Svg
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    Ant.Icons.Svg.checkOutlined
        |> Widget.Icon.antDesignIconsElm

elmFeather : (List (Svg.Attribute msg) -> icon -> Html msg) -> icon -> Icon msg

For using feathericons/elm-feather

import FeatherIcons
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    FeatherIcons.check
        |> Widget.Icon.elmFeather FeatherIcons.toHtml

elmFontawesome : (icon -> Svg msg) -> icon -> Icon msg

For using lattyware/elm-fontawesome

import FontAwesome.Icon
import FontAwesome.Solid
import FontAwesome.Svg
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    FontAwesome.Solid.check
        |> Widget.Icon.elmFontawesome FontAwesome.Svg.viewIcon

elmHeroicons : (List (Svg.Attribute msg) -> Html msg) -> Icon msg

For using jasonliang-dev/elm-heroicons

import Heroicons.Solid
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    Heroicons.Solid.check
        |> Widget.Icon.elmHeroicons

elmIonicons : (Basics.Int -> { red : Basics.Float, green : Basics.Float, blue : Basics.Float, alpha : Basics.Float } -> Html msg) -> Icon msg

For using j-panasiuk/elm-ionicons

import Ionicon
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    Ionicon.checkmark
        |> Widget.Icon.elmIonicons

elmMaterialIcons : (Color -> coloring) -> (Basics.Int -> coloring -> Html msg) -> Icon msg

For using icidasset/elm-material-icons

import Material.Icons exposing (offline_bolt)
import Material.Icons.Types exposing (Coloring(..))
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    Material.Icons.done
        |> Widget.Icon.elmMaterialIcons Color

elmOcticons : { withSize : Basics.Int -> options -> options, withColor : String -> options -> options, defaultOptions : options } -> (options -> Html msg) -> Icon msg

For using capitalist/elm-octicons

import Octicons
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    Octicons.check
        |> Widget.Icon.elmOcticons
            { withSize = Octicons.size
            , withColor = Octicons.color
            , defaultOptions = Octicons.defaultOptions
            }

elmZondicons : (List (Svg.Attribute msg) -> Html msg) -> Icon msg

For using pehota/elm-zondicons

import Widget.Icon exposing (Icon)
import Zondicons

check : Widget.Icon
check =
    Zondicons.checkmark
        |> Widget.Icon.elmZondicons

materialIcons : (Color -> Basics.Int -> Svg msg) -> Icon msg

For using danmarcab/material-icons

import Material.Icons.Action
import Widget.Icon exposing (Icon)

check : Widget.Icon
check =
    Material.Icons.Action.done
        |> Widget.Icon.materialIcons