Primary

Colors used to represent primary and complementary interface elements.

@skin-primary-light
@skin-primary
@skin-primary-dark
@skin-accent
@skin-feature
@skin-divider
Markup

Toggle example guides Toggle HTML markup

<div pam-Grid>
    <div pam-Unit="1-1 medium:1-3">
        <div pam-Skin-Test pam-skin="primary:light">@skin-primary-light</div>
    </div>
    <div pam-Unit="1-1 medium:1-3">
        <div pam-Skin-Test pam-skin="primary">@skin-primary</div>
    </div>
    <div pam-Unit="1-1 medium:1-3">
        <div pam-Skin-Test pam-skin="primary:dark">@skin-primary-dark</div>
    </div>
    <div pam-Unit="1-1 medium:1-3">
        <div pam-Skin-Test pam-skin="accent">@skin-accent</div>
    </div>
    <div pam-Unit="1-1 medium:1-3">
        <div pam-Skin-Test pam-skin="feature">@skin-feature</div>
    </div>
    <div pam-Unit="1-1 medium:1-3">
        <div pam-Skin-Test pam-skin="divider">@skin-divider</div>
    </div>
</div>