View Source Phoenix.WebComponent.Icons (Phoenix.WebComponent v2.5.1)

Render 7000+ Material Design Icons

Link to this section Summary

Functions

Return all names of available icons. Can be found at Material Icons

Render Material Design Icons

Link to this section Functions

@spec mdi_icons() :: [String.t()]

Return all names of available icons. Can be found at Material Icons

> Phoenix.WebComponent.Icons()
  #=> [
    "abacus.svg",
    "abjad-arabic.svg",
    ...
  ]

Render Material Design Icons

examples

Examples

<.wc_mdi name="abacus" id="mdi-abjad-arabic" class="w-16 h-16" />
#=> <svg xmlns="http://www.w3.org/2000/svg" id="mdi-abjad-arabic" class="w-16 h-16" viewBox="0 0 24 24"><path d="M12 4C10.08 4 8.5 5.58 8.5 7.5C8.5 8.43 8.88 9.28 9.5 9.91C7.97 10.91 7 12.62 7 14.5C7 17.53 9.47 20 12.5 20C14.26 20 16 19.54 17.5 18.66L16.5 16.93C15.28 17.63 13.9 18 12.5 18C10.56 18 9 16.45 9 14.5C9 12.91 10.06 11.53 11.59 11.12L16.8 9.72L16.28 7.79L11.83 9C11.08 8.9 10.5 8.28 10.5 7.5C10.5 6.66 11.16 6 12 6C12.26 6 12.5 6.07 12.75 6.2L13.75 4.47C13.22 4.16 12.61 4 12 4Z" /></svg>

attributes

Attributes

  • name - binary Select mantrial icon name to rener icon. example: <.wc_mdi name="abacus" />

  • id - binary Icon html attribute id

  • class - binary Icon html attribute class

attributes-1

Attributes

  • id (:string) - html attribute id. Defaults to "".
  • class (:string) - html attribute class. Defaults to "".
  • name (:string) (required) - material icon name, avaliable names are return value of mdi_icons().
  • color (:string) - icon color. Defaults to "currentcolor".