color schemer
v0.2.8
Color Schemer es un robusto conjunto de herramientas de color para Sass. Amplía las funciones de color existentes de Sass y agrega cosas como manipulación RYB, * establecer tono, * establecer luminosidad, tinte, sombra y más. También aprovecha estas herramientas agregando una herramienta de combinación de colores con todas las funciones que le permite establecer un color primario y crear combinaciones de colores completas a su alrededor.
gem install color-schemer en tu terminal.
require 'color-schemer' en su archivo de configuración de Compass.
@import 'color-schemer' a tu hoja de estilo.
tint($color, $amount) : mezcla el color con el blanco. La mayoría de los diseñadores se sienten mucho más cómodos con esto que lighten() .shade($color, $amount) : igual que el anterior pero agrega negro. Los diseñadores pueden preferirlo a darken() .equalize($color) — Devuelve un color completamente saturado.set-red($color, $red) : establece la cantidad de rojo en un color.set-green($color, $green) : establece la cantidad de verde en un color.set-blue($color, $blue) : establece la cantidad de azul en un color.set-hue($color, $hue) : establece el tono de un color.set-saturation($color, $saturation) : establece la saturación de un color.set-lightness($color, $lightness) : establece la luminosidad de un color.set-alpha($color, $alpha) : establece el alfa de un color. El esquema de color agrega una serie de funciones para manipular la rueda de colores rojo, amarillo y azul. El color por computadora se calcula en rojo, verde y azul, lo cual es más correcto técnicamente, pero los artistas y diseñadores han estado usando RYB durante años para encontrar mejores relaciones de color.
ryb-hue($color) : encontrará el tono de un color en la rueda de colores RYB.set-ryb-hue($color, $hue) : establece el tono de un color según la rueda de colores RYB.ryb-adjust-hue($color, $degrees) : ajustará el tono de un color alrededor de la rueda de colores RYB.ryb-complement($color) : encuentra el complemento RYB de un color.ryb-invert($color) : invierte un color alrededor de la rueda de colores RYB. cmyk($cyan, $magenta, $yellow, $black) : define colores utilizando valores CMYK. Coloque estas funciones donde desee utilizar un color del esquema. Puedes manipularlos aún más para que funcionen con tu diseño. Estos deben considerarse un buen punto de partida, ya que es posible que desee modificarlos un poco más.
cs-primary() — color primario.cs-secondary() — color secundario.cs-tertiary() — color terciario.cs-quadrary() — color del cuadrario. Puede cambiar el resultado de las funciones anteriores configurando estas variables globales:
$cs-primary : establece el color primario en una combinación de colores.$cs-scheme — mono, complemento, tríada, tétrada, analógico, analógico acentuado$cs-hue-offset : cantidad de ajuste de tono en los esquemas.$cs-brightness-offset : cantidad de ajuste de brillo en los esquemas.$cs-color-model — rgb, ryb El esquema de color incluye modos de fusión SCSS que le permiten realizar combinaciones de colores al estilo de Photoshop.
Si bien puede utilizar estas funciones de inmediato, es posible que desee ajustarlas un poco más. Le sugiero que cree variables con ellas en caso de que quiera hacer ajustes/mover cosas en lugar de depender de ellas tal como están.
$primary : cs-primary ();
$secondary : darken ( cs-secondary (), 10 % ); // too light, darkening this up a bit.
$tertiary : cs-tertiary ();
$quadrary : cs-quadrary ();También se incluye un práctico mixin para probar combinaciones de colores. Simplemente inclúyalo con una lista de sus colores y agregará una barra de color encima de su página.
@include cs-test ( red green blue );Copyright (c) 2011 Scott Kellum (@scottkellum) y Mason Wendell (@canarymason)
Por el presente se otorga permiso, sin cargo, a cualquier persona que obtenga una copia de este software y los archivos de documentación asociados (el "Software"), para operar con el Software sin restricciones, incluidos, entre otros, los derechos de uso, copia, modificación, fusión. , publicar, distribuir, sublicenciar y/o vender copias del Software, y permitir que las personas a quienes se les proporciona el Software lo hagan, sujeto a las siguientes condiciones:
El aviso de derechos de autor anterior y este aviso de permiso se incluirán en todas las copias o partes sustanciales del Software.
EL SOFTWARE SE PROPORCIONA "TAL CUAL", SIN GARANTÍA DE NINGÚN TIPO, EXPRESA O IMPLÍCITA, INCLUYENDO, PERO NO LIMITADO A, LAS GARANTÍAS DE COMERCIABILIDAD, IDONEIDAD PARA UN PROPÓSITO PARTICULAR Y NO INFRACCIÓN. EN NINGÚN CASO LOS AUTORES O TITULARES DE DERECHOS DE AUTOR SERÁN RESPONSABLES DE NINGÚN RECLAMO, DAÑO U OTRA RESPONSABILIDAD, YA SEA EN UNA ACCIÓN CONTRACTUAL, AGRAVIO O DE OTRA MANERA, QUE SURJA DE, FUERA DE O EN RELACIÓN CON EL SOFTWARE O EL USO U OTRAS NEGOCIOS EN EL SOFTWARE.
