Skip to content

The most used Brand & SocialMedia Colors for WebDevelopers - 136 Colors

License

Notifications You must be signed in to change notification settings

Thejuse/SocialColors

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

72 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SocialColors

Donate GitHub

The most used Brand & SocialMedia Colors for WebDevelopers

Getting Started

Download & Customize

You want to manage & host SocialColors yourself? You can download, customice and use the colors and default stylings manually. Both CSS and CSS Preprocessor (SCSS) formats are included.

Using CSS

  1. Copy the socialcolors.css in your CSS directory.
  2. In the <head> of your html, reference the location to your socialColors.css or socialColors.min.css <link rel="stylesheet" href"path/to/socialcolors.css">
  3. Check out the examples to start using socialColors

Using SCSS

  1. Copy the socialColors.scss or socialColors.css in your SCSS/CSS directory.
  2. Open your project and edit the things you want.
  3. Re-Complie your SCCS if using a static compiler. Otherwise, you should be good to go.
  4. Check out the examples

Using CDN

CSS - <link rel="stylesheet" href="https://unpkg.com/socialcolors@3.2.0/css/socialcolors.css">
Min-CSS - <link rel="stylesheet" href="https://unpkg.com/socialcolors@3.2.0/css/socialcolors.min.css">

Using NPM

npm install socialcolors - Add to your NPM-Project

Examples

Basic use

Color

You can place the socialColors enywhere using the CSS Prefix sc and the Brand name.
<p class="sc sc-instagram sc-color>Test</p>"

You can also use it as an hover color using the CSS Prefix sc-hover
<div class="sc sc-instagram sc-hover"></div>

Background-color

For a backgroundcolor you using the CSS Prefix sc, the brand name & sc-background <p class="sc sc-instagram sc-background>Test</p>"

You can also use it as an hover backgroundcolor using the CSS Prefix sc-background-hover
<div class="sc sc-instagram sc-background-hover"></div>

All Colors:

View the Colors here: socialcolors.net

Licence

Copyright (c) 2017-2019 Julian Seidl Licensed under the MIT Licence