Action chips offer actions related to primary content. They should appear dynamically and contextually in a UI.

An alternative to action chips are buttons, which should appear persistently and consistently.

Table of Contents

• Resources
• Basic Usage
• Action Chip Set

Resources

• Demo: Chips
• Material Design Guidelines: Chips
• MDC Web: Chips
• Sass Mixins (MDC Web)

Basic Usage

import Material.Chip.Action as ActionChip
import Material.ChipSet.Action as ActionChipSet


type Msg
    = ChipClicked String


main =
    ActionChipSet.chipSet []
        (ActionChip.chip
            (ActionChip.config
                |> ActionChip.setOnClick
                    (ChipClicked "Chip One")
            )
            "Chip One"
        )
        [ ActionChip.chip ActionChip.config "Chip Two"
        ]

Action Chip Set