Variables

Tweak your castles defaults

This is the variable file example for castlecss-core LOWER then 2.0, need 2.x? Click here

Note: Never overwrite the castlecss-core variables, but instead create your own document and overwrite the variables there. We have already included said document in the boilerplate.

Below you can find the default settings of a CastleCSS website.

					/* 	Variables
						Add or replace variables in your OWN variables file
					*/

					/*
						Base colors
						Color 01 and 02 reservered for white and black
					*/
					$color01:  	#fff;
					$color02:  	#000;

					/*	Theme colors */
					$theme01: 	#1B94BF;	// Knight blue
					$theme02: 	#093142; 	// Royal blue
					$theme03:	#12637F;	// Falcon blue
					$theme04:	#FFC200;	// Royal yellow
					$theme05:	#FFFFFF;	// Destroyer white

					$alert:		#FFD700;
					$negative:	#FF7878;
					$positive:	#29C85D;
					$disabled:	#CDCDC1;

					/* Breakpoints */
					$b1: 320px;
					$b2: 480px;
					$b3: 768px;
					$b4: 1024px;
					$b5: 1280px;
					$b6: 1600px;

					/* Container sizes */
					$container: 100%;
					$container-b1: 100%;
					$container-b2: 100%;
					$container-b3: 744px;
					$container-b4: 996px;
					$container-b5: 1224px;
					$container-b6: 1400px;

					/* Grid */
					$flexbox-grid:	 true;
					$grid-gutter:	 12px;
					$grid-gutter-b1: 12px;
					$grid-gutter-b2: 12px;
					$grid-gutter-b3: 12px;
					$grid-gutter-b4: 12px;
					$grid-gutter-b5: 12px;
					$grid-gutter-b6: 12px;

					/* Default margin, padding, gutter */
					$padding-default: 	12px;
					$margin-default: 	12px;

					/* Standard border-radius */
					$radius:	5px;

					/* Fonts */
					$font-pri: Arial, Helvetica, sans-serif;
					$font-sec: Arial, Helvetica, sans-serif;
					$font-size-default: 1.6rem;
					$line-height-default: 1.5;