Copied to clipboard

gStride AI

Brand Kit
"From busy work to real output."
Version 1.0 March 2026 by Groovy Connect

The Mission

gStride AI exists to give individuals back their most valuable resource: focused time. Professionals lose thousands of hours each year to fragmented workflows -- switching between time trackers, task boards, leave systems, and scattered notes. gStride AI absorbs that friction entirely. Punch in, set your focus, and let the AI surface what matters. We are building the future where productive people stop managing their tools and start owning their output.
"We don't just track time. We help you own it."
-- gStride AI Brand Promise

Empowering

We put the individual in control. Every feature is designed to amplify personal capability, not add overhead.

Personal

This is your productivity suite. It adapts to how you work, not the other way around. Intimate, not institutional.

Focused

One screen, one priority. We strip away the noise so you can do deep work without distraction.

Growth-oriented

Every day is a chance to go further. The AI learns your patterns and helps you improve week over week.

Do
  • Be encouraging. Lead with what the user can achieve.
  • Use "stride" as a verb. Find your stride. Stride through tasks. Keep striding.
  • Write for individuals. Assume personal ambition.
  • Use short, clear sentences. Action-oriented, warm.
  • Show confidence. "gStride helps you own your day." Not "gStride might help you be productive."
  • Reference real workflows: punch in, focus blocks, Pomodoro, leave requests.
Don't
  • Use corporate buzzwords: "leverage", "synergy", "optimize resources".
  • Over-qualify with hedging: "might", "could potentially", "may help".
  • Use exclamation marks. Calm confidence, not hype.
  • Write long paragraphs. If it takes 3 sentences, use 2.
  • Use emojis in product copy or documentation.
  • Talk about the tool more than the person using it.

Clear Space Rules

Maintain a minimum clear space equal to 1x the height of the icon on all sides. This ensures the logo always has breathing room and is never crowded by adjacent elements. Note the logo is 3:2 landscape ratio -- clear space is based on the shorter dimension (height).
Clear space demo
1x height 1x height 1x height 1x height

Icon only: minimum 48px wide (32px tall at 3:2 ratio). With wordmark: minimum 120px wide.

Below 48px wide, the logo loses legibility and must not be used.

128px 128px
64px 64px
48px 48px
32px 32px
24px 24px (below min)

Do's and Don'ts

Consistent logo usage is critical to maintaining brand integrity. Follow these rules at all times.
Do: dark background
+ Use on solid dark backgrounds
Do: original proportions
+ Maintain original proportions
Do: correct variant
+ Use provided color variants
Do: white on color
+ White variant on brand colors
Don't: stretch
x Stretch or distort
Don't: recolor
x Change logo colors
Don't: add effects
x Add shadows or effects
Don't: busy background
x Place on busy backgrounds
Don't: rotate
x Rotate the logo

Color System

The gStride AI color palette is built around an emerald primary with deep midnight backgrounds. Every color has a defined role. Click any hex code to copy it to your clipboard.
Primary Colors
Emerald 500
#10b981
rgb(16, 185, 129)
Emerald 600
#059669
rgb(5, 150, 105)
Emerald 700
#047857
rgb(4, 120, 87)
Emerald 400
#34d399
rgb(52, 211, 153)
Emerald 300
#6ee7b7
rgb(110, 231, 183)
Neutral / Background
Midnight
#0a0a1a
rgb(10, 10, 26)
Surface
#111827
rgb(17, 24, 39)
Surface Light
#1e293b
rgb(30, 41, 59)
White
#ffffff
rgb(255, 255, 255)
Light Gray
#f1f5f9
rgb(241, 245, 249)
Text Colors
Primary (on Dark)
#ffffff
rgb(255, 255, 255)
Secondary (on Dark)
#94a3b8
rgb(148, 163, 184)
Muted
#64748b
rgb(100, 116, 139)
Dark Primary (on Light)
#0f172a
rgb(15, 23, 42)
Dark Secondary (on Light)
#475569
rgb(71, 85, 105)
Semantic Colors
Success
#10b981
rgb(16, 185, 129)
Error
#ef4444
rgb(239, 68, 68)
Warning
#f59e0b
rgb(245, 158, 11)
Info
#3b82f6
rgb(59, 130, 246)

Type System

Inter is the primary typeface for all gStride AI communications. JetBrains Mono is used for code, technical content, and monospaced elements. Both are loaded from Google Fonts.
Display 56px / 800
-0.02em tracking
Find your pace
Heading 1 40px / 700
From busy work to real output
Heading 2 32px / 700
AI-powered productivity insights
Heading 3 24px / 600
Punch in. Focus. Stride through your day.
Heading 4 18px / 600
Time tracking, task management, and Pomodoro -- unified
Body 16px / 400
1.6 line-height
gStride AI combines punch-in/out time tracking, task management, project tracking, leave management, and a Pomodoro timer into one focused workspace. AI-powered insights help you understand your patterns and increase your output every week.
Body Small 14px / 400
Track time per project, manage tasks with priorities, and get weekly AI reports on where your hours went.
Caption 12px / 500
uppercase / 1px tracking
Focus session: 47 minutes remaining
Code 14px / JetBrains Mono
400 weight
gstride punch-in --project "client-app" --focus deep
Font Loading
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
font-family: 'JetBrains Mono', 'Fira Code', monospace;

Visual Language

gStride AI visuals are warm, personal, and growth-focused. Deep greens and emeralds dominate. Imagery should feel like the calm focus of a productive morning -- clear desk, single task, forward momentum.
Warm growth

Warm & Growth-focused

Primary aesthetic. Deep backgrounds with subtle emerald accents and gradients. Feels personal and empowering.

Gradient overlay

Gradient Overlays

When placing the logo or text over photos, always apply a dark gradient overlay (bottom-up) to ensure legibility.

Geometric

Geometric Patterns

Line-based, geometric illustrations using brand colors only. Clean intersections. No gradients on lines.

Photo treatment

Photography Treatment

Desaturate, apply dark overlay, tint toward green. Photography should support the brand feel -- focused, clean, personal.

Guidelines Summary
  • - Backgrounds: #0a0a1a to #111827 range, never lighter than #1e293b
  • - Accent glows: Radial gradients of emerald at 8-15% opacity, never full brightness
  • - Photography: Desaturate 40-60%, overlay at 70-95% opacity, tint toward green
  • - Illustrations: Single-weight strokes, 1px on screen, brand colors only
  • - Icons: Outline style, 1.5px stroke, rounded caps and joins

Component Library

Core UI components styled in the gStride AI brand. These serve as the reference for product interfaces, marketing pages, and documentation.
Buttons
Input Fields
Card

Focus Session #312

Deep work completed. 2h 15m focused time. 4 tasks closed.

Completed Deep Focus
Badges & Tags
In Progress Done On Break Overdue
Alerts
+
Punch in recorded. Focus session started.
!
You forgot to punch out yesterday. Please update.
!
Leave balance low. 2 days remaining this quarter.
i
Weekly report ready. You logged 38.5 hours across 6 projects.

Social Templates

Standard social media template sizes for consistent brand presence across platforms. All templates use the dark aesthetic with centered or left-aligned logo placement.

Applied Examples

Real-world applications of the gStride AI brand across digital and physical touchpoints.
gStride gStride by Groovy Connect
Start Free

From busy work to real output

Punch in. Focus. Let AI handle the rest. Your productivity suite, simplified.

Website Header & Hero
Krunal Panchal
Founder, Groovy Connect
Email Signature
gStride

gStride AI

by Groovy Connect

Krunal Panchal Founder & CEO
krunal.panchal@groovyweb.co
gstride.ai
groovyweb.co
Business Card (Front & Back)
gStride gStride AI

Your Productivity,
Amplified

Track time, manage tasks, stay focused. gStride AI learns your patterns and helps you go further every day -- one punch-in at a time.

Presentation Title Slide

Asset Library

All brand assets available for download. Use the appropriate variant for your context.
Asset Category Format Usage
Primary Logo (Color) PNG Dark backgrounds, digital, marketing Download
Dark Logo (Black) PNG Light backgrounds, print, documents Download
White Logo PNG Colored backgrounds, overlays Download
Color Palette (JSON) Color JSON Development, design tools
Inter (Google Fonts) Typography WOFF2 Primary typeface: 400, 500, 600, 700, 800 Google Fonts
JetBrains Mono (Google Fonts) Typography WOFF2 Monospace: code, technical elements Google Fonts

Brand Usage Questions

For questions about brand usage, partnerships, or co-marketing requests:

brand@groovyweb.co
gstride.ai | groovyweb.co