name: Accent Colors
description: Accent colors for the Citadel theme
type: core
form:
fields:
color-1:
type: input.colorpicker
label: Accent Color 1
default: "#f9b234"
color-2:
type: input.colorpicker
label: Accent Color 2
default: "#111111"
color-3:
type: input.colorpicker
label: Accent Color 3
default: "#121212"
preset1:
image: 'gantry-admin://images/preset1.png'
description: 'Preset 1'
colors:
- '#f9b234'
- '#ffffff'
- '#111111'
styles:
base:
background: '#eeeeee'
text-color: '#666666'
accent:
color-1: '#f9b234'
color-2: '#111111'
color-3: '#121212'
font:
family-default: 'sintony, sans-serif, Tahoma, Geneva, Arial'
family-title: 'cabin, sans-serif, Tahoma, Geneva, Arial'
family-promo: 'raleway, sans-serif, Tahoma, Geneva, Arial'
family-subpromo: 'playfairdisplay, sans-serif, Tahoma, Geneva, Arial'
family-logo: 'blanch, sans-serif, Tahoma, Geneva, Arial'
family-weather: 'weather'
top:
background: '#f9b234'
text-color: '#ffffff'
navigation:
background: 'rgba(0,0,0, 0.5)'
text-color: '#ffffff'
slideshow:
background: '#ffffff'
background-image: 'gantry-media://backgrounds/slideshow/img-01.jpg'
video: 'gantry-media://videos/slideshow/sample.webm'
text-color: '#666666'
header:
background: '#ffffff'
text-color: '#666666'
above:
background: '#111111'
background-image: 'gantry-media://backgrounds/above/img-01.jpg'
text-color: '#ffffff'
showcase:
background: '#ffffff'
text-color: '#666666'
utility:
background: '#ffffff'
text-color: '#666666'
feature:
background: '#111111'
text-color: '#ffffff'
main:
background: '#ffffff'
text-color: '#666666'
expanded:
background: '#f9b234'
text-color: '#ffffff'
extension:
background: '#ffffff'
text-color: '#666666'
bottom:
background: '#f9b234'
text-color: '#ffffff'
footer:
background: '#111111'
background-image: 'gantry-media://backgrounds/footer/img-01.jpg'
text-color: '#ffffff'
copyright:
background: 'rgba(0,0,0, 0.0)'
text-color: '#acacac'
offcanvas:
background: '#121212'
text-color: '#ffffff'
toggle-color: '#ffffff'
breakpoints:
large-desktop-container: 80rem
desktop-container: 60rem
tablet-container: 48rem
large-mobile-container: 30rem
mobile-menu-breakpoint: 48rem
preset2:
image: 'gantry-admin://images/preset2.png'
description: 'Preset 2'
colors:
- '#ff5144'
- '#ffffff'
- '#111111'
styles:
base:
background: '#eeeeee'
text-color: '#666666'
accent:
color-1: '#ff5144'
color-2: '#111111'
font:
family-default: 'sintony, sans-serif, Tahoma, Geneva, Arial'
family-title: 'cabin, sans-serif, Tahoma, Geneva, Arial'
family-promo: 'raleway, sans-serif, Tahoma, Geneva, Arial'
family-subpromo: 'playfairdisplay, sans-serif, Tahoma, Geneva, Arial'
family-logo: 'blanch, sans-serif, Tahoma, Geneva, Arial'
family-weather: 'weather'
top:
background: '#ff5144'
text-color: '#ffffff'
navigation:
background: 'rgba(0,0,0, 0.5)'
text-color: '#ffffff'
slideshow:
background: '#ffffff'
background-image: 'gantry-media://backgrounds/slideshow/img-01.jpg'
video: 'gantry-media://videos/slideshow/sample.webm'
text-color: '#666666'
header:
background: '#ffffff'
text-color: '#666666'
above:
background: '#111111'
background-image: 'gantry-media://backgrounds/above/img-01.jpg'
text-color: '#ffffff'
showcase:
background: '#ffffff'
text-color: '#666666'
utility:
background: '#ffffff'
text-color: '#666666'
feature:
background: '#111111'
text-color: '#ffffff'
main:
background: '#ffffff'
text-color: '#666666'
expanded:
background: '#ff5144'
text-color: '#ffffff'
extension:
background: '#ffffff'
text-color: '#666666'
bottom:
background: '#ff5144'
text-color: '#ffffff'
footer:
background: '#111111'
background-image: 'gantry-media://backgrounds/footer/img-01.jpg'
text-color: '#ffffff'
copyright:
background: 'rgba(0,0,0, 0.0)'
text-color: '#acacac'
offcanvas:
background: '#121212'
text-color: '#ffffff'
toggle-color: '#ffffff'
breakpoints:
large-desktop-container: 80rem
desktop-container: 60rem
tablet-container: 48rem
large-mobile-container: 30rem
mobile-menu-breakpoint: 48rem
preset3:
image: 'gantry-admin://images/preset3.png'
description: 'Preset 3'
colors:
- '#6d4ae0'
- '#ffffff'
- '#111111'
styles:
base:
background: '#eeeeee'
text-color: '#666666'
accent:
color-1: '#6d4ae0'
color-2: '#111111'
font:
family-default: 'sintony, sans-serif, Tahoma, Geneva, Arial'
family-title: 'cabin, sans-serif, Tahoma, Geneva, Arial'
family-promo: 'raleway, sans-serif, Tahoma, Geneva, Arial'
family-subpromo: 'playfairdisplay, sans-serif, Tahoma, Geneva, Arial'
family-logo: 'blanch, sans-serif, Tahoma, Geneva, Arial'
family-weather: 'weather'
top:
background: '#6d4ae0'
text-color: '#ffffff'
navigation:
background: 'rgba(0,0,0, 0.5)'
text-color: '#ffffff'
slideshow:
background: '#ffffff'
background-image: 'gantry-media://backgrounds/slideshow/img-01.jpg'
video: 'gantry-media://videos/slideshow/sample.webm'
text-color: '#666666'
header:
background: '#ffffff'
text-color: '#666666'
above:
background: '#111111'
background-image: 'gantry-media://backgrounds/above/img-01.jpg'
text-color: '#ffffff'
showcase:
background: '#ffffff'
text-color: '#666666'
utility:
background: '#ffffff'
text-color: '#666666'
feature:
background: '#111111'
text-color: '#ffffff'
main:
background: '#ffffff'
text-color: '#666666'
expanded:
background: '#6d4ae0'
text-color: '#ffffff'
extension:
background: '#ffffff'
text-color: '#666666'
bottom:
background: '#6d4ae0'
text-color: '#ffffff'
footer:
background: '#111111'
background-image: 'gantry-media://backgrounds/footer/img-01.jpg'
text-color: '#ffffff'
copyright:
background: 'rgba(0,0,0, 0.0)'
text-color: '#acacac'
offcanvas:
background: '#121212'
text-color: '#ffffff'
toggle-color: '#ffffff'
breakpoints:
large-desktop-container: 80rem
desktop-container: 60rem
tablet-container: 48rem
large-mobile-container: 30rem
mobile-menu-breakpoint: 48rem
preset4:
image: 'gantry-admin://images/preset4.png'
description: 'Preset 4'
colors:
- '#00bde2'
- '#ffffff'
- '#111111'
styles:
base:
background: '#eeeeee'
text-color: '#666666'
accent:
color-1: '#00bde2'
color-2: '#111111'
font:
family-default: 'sintony, sans-serif, Tahoma, Geneva, Arial'
family-title: 'cabin, sans-serif, Tahoma, Geneva, Arial'
family-promo: 'raleway, sans-serif, Tahoma, Geneva, Arial'
family-subpromo: 'playfairdisplay, sans-serif, Tahoma, Geneva, Arial'
family-logo: 'blanch, sans-serif, Tahoma, Geneva, Arial'
family-weather: 'weather'
top:
background: '#00bde2'
text-color: '#ffffff'
navigation:
background: 'rgba(0,0,0, 0.5)'
text-color: '#ffffff'
slideshow:
background: '#ffffff'
background-image: 'gantry-media://backgrounds/slideshow/img-01.jpg'
video: 'gantry-media://videos/slideshow/sample.webm'
text-color: '#666666'
header:
background: '#ffffff'
text-color: '#666666'
above:
background: '#111111'
background-image: 'gantry-media://backgrounds/above/img-01.jpg'
text-color: '#ffffff'
showcase:
background: '#ffffff'
text-color: '#666666'
utility:
background: '#ffffff'
text-color: '#666666'
feature:
background: '#111111'
text-color: '#ffffff'
main:
background: '#ffffff'
text-color: '#666666'
expanded:
background: '#00bde2'
text-color: '#ffffff'
extension:
background: '#ffffff'
text-color: '#666666'
bottom:
background: '#00bde2'
text-color: '#ffffff'
footer:
background: '#111111'
background-image: 'gantry-media://backgrounds/footer/img-01.jpg'
text-color: '#ffffff'
copyright:
background: 'rgba(0,0,0, 0.0)'
text-color: '#acacac'
offcanvas:
background: '#121212'
text-color: '#ffffff'
toggle-color: '#ffffff'
breakpoints:
large-desktop-container: 80rem
desktop-container: 60rem
tablet-container: 48rem
large-mobile-container: 30rem
mobile-menu-breakpoint: 48rem
preset5:
image: 'gantry-admin://images/preset5.png'
description: 'Preset 5'
colors:
- '#00c67e'
- '#ffffff'
- '#111111'
styles:
base:
background: '#eeeeee'
text-color: '#666666'
accent:
color-1: '#00c67e'
color-2: '#111111'
font:
family-default: 'sintony, sans-serif, Tahoma, Geneva, Arial'
family-title: 'cabin, sans-serif, Tahoma, Geneva, Arial'
family-promo: 'raleway, sans-serif, Tahoma, Geneva, Arial'
family-subpromo: 'playfairdisplay, sans-serif, Tahoma, Geneva, Arial'
family-logo: 'blanch, sans-serif, Tahoma, Geneva, Arial'
family-weather: 'weather'
top:
background: '#00c67e'
text-color: '#ffffff'
navigation:
background: 'rgba(0,0,0, 0.5)'
text-color: '#ffffff'
slideshow:
background: '#ffffff'
background-image: 'gantry-media://backgrounds/slideshow/img-01.jpg'
video: 'gantry-media://videos/slideshow/sample.webm'
text-color: '#666666'
header:
background: '#ffffff'
text-color: '#666666'
above:
background: '#111111'
background-image: 'gantry-media://backgrounds/above/img-01.jpg'
text-color: '#ffffff'
showcase:
background: '#ffffff'
text-color: '#666666'
utility:
background: '#ffffff'
text-color: '#666666'
feature:
background: '#111111'
text-color: '#ffffff'
main:
background: '#ffffff'
text-color: '#666666'
expanded:
background: '#00c67e'
text-color: '#ffffff'
extension:
background: '#ffffff'
text-color: '#666666'
bottom:
background: '#00c67e'
text-color: '#ffffff'
footer:
background: '#111111'
background-image: 'gantry-media://backgrounds/footer/img-01.jpg'
text-color: '#ffffff'
copyright:
background: 'rgba(0,0,0, 0.0)'
text-color: '#acacac'
offcanvas:
background: '#121212'
text-color: '#ffffff'
toggle-color: '#ffffff'
breakpoints:
large-desktop-container: 80rem
desktop-container: 60rem
tablet-container: 48rem
large-mobile-container: 30rem
mobile-menu-breakpoint: 48rem
preset6:
image: 'gantry-admin://images/preset6.png'
description: 'Preset 6'
colors:
- '#f3600b'
- '#ffffff'
- '#111111'
styles:
base:
background: '#eeeeee'
text-color: '#666666'
accent:
color-1: '#f3600b'
color-2: '#111111'
font:
family-default: 'sintony, sans-serif, Tahoma, Geneva, Arial'
family-title: 'cabin, sans-serif, Tahoma, Geneva, Arial'
family-promo: 'raleway, sans-serif, Tahoma, Geneva, Arial'
family-subpromo: 'playfairdisplay, sans-serif, Tahoma, Geneva, Arial'
family-logo: 'blanch, sans-serif, Tahoma, Geneva, Arial'
family-weather: 'weather'
top:
background: '#f3600b'
text-color: '#ffffff'
navigation:
background: 'rgba(0,0,0, 0.5)'
text-color: '#ffffff'
slideshow:
background: '#ffffff'
background-image: 'gantry-media://backgrounds/slideshow/img-01.jpg'
video: 'gantry-media://videos/slideshow/sample.webm'
text-color: '#666666'
header:
background: '#ffffff'
text-color: '#666666'
above:
background: '#111111'
background-image: 'gantry-media://backgrounds/above/img-01.jpg'
text-color: '#ffffff'
showcase:
background: '#ffffff'
text-color: '#666666'
utility:
background: '#ffffff'
text-color: '#666666'
feature:
background: '#111111'
text-color: '#ffffff'
main:
background: '#ffffff'
text-color: '#666666'
expanded:
background: '#f3600b'
text-color: '#ffffff'
extension:
background: '#ffffff'
text-color: '#666666'
bottom:
background: '#f3600b'
text-color: '#ffffff'
footer:
background: '#111111'
background-image: 'gantry-media://backgrounds/footer/img-01.jpg'
text-color: '#ffffff'
copyright:
background: 'rgba(0,0,0, 0.0)'
text-color: '#acacac'
offcanvas:
background: '#121212'
text-color: '#ffffff'
toggle-color: '#ffffff'
breakpoints:
large-desktop-container: 80rem
desktop-container: 60rem
tablet-container: 48rem
large-mobile-container: 30rem
mobile-menu-breakpoint: 48rem
The following users have thanked you: David Goode, Matt, Thomas Esher
The following users have thanked you: danthecardman
// Basics
$white: #ffffff;
$black: #000000;
$off-white: #f7f7f7;
$grey: #95a5a6;
$darkgrey: #282828;
$pink: #d13b7b;
$red: #ef4a44;
$purple: #874f9a;
$blue: #279fba;
$orange: #ee7933;
// Base
$base-background: #eeeeee !default;
$base-text-color: #666666 !default;
$base-border-color: #E7E8EA !default;
// Accents
$accent-color-1: #f9b234 !default;
$accent-color-2: #111111 !default;
$accent-color-3: #121212 !default;
// Page Surround
$pagesurround-background: $base-background !default;
// Top
$top-background: #f9b234 !default;
$top-text-color: #ffffff !default;
// Slideshow
$slideshow-background: #ffffff !default;
$slideshow-background-image: false !default;
$slideshow-text-color: #666666 !default;
// Header
$header-background: #ffffff !default;
$header-text-color: #666666 !default;
// Above
$above-background: #111111 !default;
$above-background-image: false !default;
$above-text-color: #ffffff !default;
// Showcase
$showcase-background: #ffffff !default;
$showcase-text-color: #666666 !default;
// Utility
$utility-background: #ffffff !default;
$utility-text-color: #666666 !default;
// Feature
$feature-background: #111111 !default;
$feature-text-color: #ffffff !default;
// Main
$main-background: #ffffff !default;
$main-text-color: #666666 !default;
// Expanded
$expanded-background: #f9b234 !default;
$expanded-text-color: #ffffff !default;
// Extension
$extension-background: #ffffff !default;
$extension-text-color: #666666 !default;
// Bottom
$bottom-background: #f9b234 !default;
$bottom-text-color: #ffffff !default;
// Footer
$footer-background: #111111 !default;
$footer-background-image: false !default;
$footer-text-color: #ffffff !default;
// Copyright
$copyright-background: rgba(0,0,0, 0.0) !default;
$copyright-text-color: #acacac !default;
// Off Canvas
$offcanvas-background: #121212 !default;
$offcanvas-text-color: #ffffff !default;
$offcanvas-toggle-color: #ffffff !default;
// Block Variations
$box1-background: $accent-color-1 !default;
$box2-background: $accent-color-2 !default;
$box3-background: $black !default;
$box4-background: darken($base-background, 5%) !default;
$box-white-background: $white !default;
$box-grey-background: $grey !default;
$box-darkgrey-background: $darkgrey !default;
$box-pink-background: $pink !default;
$box-red-background: $red !default;
$box-purple-background: $purple !default;
$box-blue-background: $blue !default;
$box-orange-background: $orange !default;
// System Messsages and Alerts
$warning-color: #c09853;
$error-color: #b94a48;
$info-color: #3a87ad;
$success-color: #468847;
// Typography
$rule-color: fadeout($base-border-color, 75%);
$code-text: #c7254e;
$code-bg: #f9f2f4;
$pre-text: #237794;
$pre-bg: #f6f6f6;
// Borders
$border-color-hover: $accent-color-1;
$border-color-focus: $accent-color-1;
$border-color-light: rgba(0, 0, 0, 0.1);
// Shadows
$base-box-shadow: inset 0 1px 3px hsla(0, 0%, 0%, 0.06);
$base-content-shadow: 2px 1px 15px rgba(0, 0, 0, 0.05);
The following users have thanked you: Matt
Time to create page: 0.041 seconds