@brandcolors/snapchat

Introduction

Snapchat Brand Colors.

Installation

npm install @brandcolors/snapchat

Usage

Styles

@use "@brandcolors/snapchat/styles";

The styles will create all custom properties in CSS root. If you want this custom properties anywhere else, use the public mixin custom-properties.

Theming

@use "@brandcolors/snapchat";

.foo {
    color: snapchat.$primary;
    // color: #fffc00;
    color: snapchat.$primary-rgb;
    // color: rgb(255, 252, 0);
}

Custom Properties

@use "@brandcolors/snapchat";

:root {
    @include snapchat.custom-properties(primary);
    // --bc-snapchat-primary: #fffc00;
    @include snapchat.custom-properties(primary-rgb);
    // --bc-snapchat-primary-rgb: rgb(255, 252, 0);
}

API

Variables

Variable	Value
$primary	Return hex value color.
$primary-rgb	Return rgb color.

Mixins

Mixin	Description
custom-properties($values...)	Create dedicated custom property. If the $values is empty, the mixin will create all styles by default.