↓ Skip to main content

Color Palette

·242 words·2 mins
Table of Contents
Fortego’s custom color palette using Tailwind CSS classes.

Brand Colors
#

Primary (Steel Blue)
50
100
200
300
400
500
600
700
800
900
950
Secondary (Bronze)
50
100
200
300
400
500
600
700
800
900
950
Accent (Bitcoin Orange)
50
100
200
300
400
500
600
700
800
900
950
Neutral (Papyrus/Brown)
50
100
200
300
400
500
600
700
800
900
950

Components
#

Alerts
#

Primary (Steel Blue) - Default alert uses primary color
Secondary (Bronze) - Custom alert using CSS variables
Accent (Bitcoin Orange) - Custom alert using CSS variables

Badges
#

Steel Blue Bronze Bitcoin Orange

Buttons
#

Steel Blue Button Bronze Button Orange Button

Typography
#

The color scheme applies to all text elements:

Headings
#

Heading 1
#

Heading 2
#

Heading 3
#

Body Text
#

Regular paragraph text uses the dark brown color on papyrus background. Bold text and italic text maintain the same warm color palette.

Links #

This is a link using the primary steel blue color.

Lists
#

  • First item
  • Second item
  • Third item
  1. Numbered item
  2. Another item
  3. Final item

Blockquotes
#

“Innovation distinguishes between a leader and a follower.”
— Steve Jobs

Code
#

Inline code and code blocks:

const colors = {
  primary: '#4178AF',
  secondary: '#B48755',
  accent: '#F7931A'
};

Tables
#

Color Hex Usage
Steel Blue #4178AF Primary
Bronze #B48755 Secondary
Bitcoin Orange #F7931A Accent
All colors are defined in assets/css/schemes/fortego.css and applied via Tailwind utility classes.