Sencha Style Guide

Brand guidelines for designers and developers

Color


Color Palette

All of Sencha’s elements: canvases, headers, footers, and typography come from Sencha’s color palette. These colors must be used in order to reflect Sencha’s brand.

Base Color


HEX

#025B80


USES

Base Color, Main Header,

Buttons, link:hover

Color Name


HEX

#014D6C


USES

Button Hover

Color Name


HEX

#024059


USES

Button Outline

Button Pressed

Color Name


HEX

#0A8CC6


USES

Text Links

Color Name


HEX

#0A8CC6 at 20%


USES

Selected Grid Row

Color Name


HEX

#4A4A4A


USES

Body Text, Tree Text

Color Name


HEX

#919191


USES

Icons

Color Name


HEX

#BCBCBC


USES

Secondary Button Border

Secondary Button Pressed

Color Name


HEX

#D0D0D0


USES

Text Field Border

Color Name


HEX

#E6E6E6


USES

Splitter, Class Nav Header,

Toolbar Button Hover, Grid

Color Name


HEX

#F5F5F5


USES

Footer, Secondary Button

Color Name


HEX

#F9F9F9


USES

Grid Background Color

Improper Use of Color Palette

Do not use the accent color for the body text or larger areas of color.