GetSmart Token™ Style Guide

Colors

Primary Colors

• Green (Header Background): #4CD964 or similar
• White (Main Background): #FFFFFF
• Black (Main Text): #000000

Secondary Colors

• Light Green (Button Border): #3CB371 or similar
• Very Light Green (Page Accent): #F0FFF0 or similar

Typography

Logo

• Font: Custom or heavily modified sans-serif
• Color: White on green background

Headings

• Font: Roboto, bold
• Color: Black
• Sizes:
  • Main Heading: 48px or larger
  • Subheading: 36px or similar

Body Text

• Font: Open Sans
• Color: Black

Logo

• Circular sun-like design with spikes
• Letter “G” in the center (assuming it’s for GetSmart)
• Colors: Orange/red with yellow accents

Header

• Background Color: Green
• Logo aligned to the left
• “GET SMART” text next to the logo in white
• Search bar in the center with placeholder text “Search For Badges”
• “Explore” link/button on the right

Buttons

Primary Button

• Background Color: Green (#4CD964 or similar)
• Text Color: White
• Border: None
• Border Radius: Rounded corners (about 5px)
• Padding: 10px 20px (approximate)

Secondary Button

• Background Color: White
• Text Color: Green
• Border: 1px solid green
• Border Radius: Rounded corners (about 5px)
• Padding: 10px 20px (approximate)

Layout

• Full-width header
• Centered content with max-width (approximately 1200px)
• Ample white space around elements
• Subtle curved shape separating header from main content

Responsive Design

• The layout appears to be designed for desktop view
• Consider implementing responsive breakpoints for tablet and mobile views

Accessibility

• Ensure sufficient color contrast, especially for green text on white backgrounds
• Use semantic HTML elements for proper structure and screen reader compatibility

Iconography

• User icon on the “GET STARTED” button: Font Awesome User Icon
• Wallet or token icon on the “GET TOKENS” button: Font Awesome Wallet Icon

Remember to maintain consistency with these style guidelines across all pages and components of the GetSmart Token™ platform.