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. |