Design System v1.0
Brand Guidelines
Standard desain, visual, dan komunikasi untuk membangun konsistensi brand TukTix
1
Brand Identity
Brand Essence
"Your Gateway to Unforgettable Events"
Brand Promise
Connecting people to experiences through effortless, reliable, and exciting ticketing solutions.
Brand Personality
Reliable
Trustworthy platform for seamless ticket transactions.
Dynamic
Energetic and exciting, matching the events we serve.
Inclusive
Accessible to everyone, from local to major events.
2
Logo Guidelines
Variations
-
TUKTIXFull ColorPrimary brand colors on light backgrounds
-
TUKTIXReversedWhite on dark backgrounds
Spacing & Sizing
Minimum Width
120px / 30mm
Icon Only Min
32px x 32px
Clear Space
Equal to the height of "TUK" on all sides
3
Color System
Primary Colors
Navy Blue
#194087
Primary CTA, Headers, Nav
Vibrant Red
#EB0303
Accent, Urgent Actions
Secondary Colors
Sky Blue
#4A90E2
Coral Red
#FF4D4D
Neutral Colors
Charcoal
#1F2937
Slate Gray
#64748B
Light Gray
#F1F5F9
Pure White
#FFFFFF
Pure Black
#000000
Semantic Colors
Success
#059669
Warning
#D97706
Error
#DC2626
Info
#2563EB
4
Typography
Primary Typeface
Plus Jakarta Sans
Aa
| Scale | Specs | Example |
|---|---|---|
| H1 Display | 48px / 800 | The quick brown fox |
| H2 Heading | 36px / 700 | The quick brown fox |
| H3 Heading | 28px / 700 | The quick brown fox |
| Body Large | 18px / 400 | The quick brown fox jumps over the lazy dog. |
| Body Regular | 16px / 400 | The quick brown fox jumps over the lazy dog. |
5
UI Components
Buttons
Default
Mobile Action
Secondary
Ghost
Forms
This field is required
6
Iconography
We use Heroicons (Outline) for consistency across the platform.
7
Imagery & Photography
Energetic
Authentic
Style Guide
- Use high-quality, high-resolution images.
- Focus on capturing genuine emotions and moments.
- Avoid staged or overly stock-looking photography.
- Ensure diverse representation of people and events.
Social Media Guidelines
Brand Hierarchy
Platform-level branding. Modern, professional, and trustworthy.
Co-branding with TukTix. Balanced visibility.
Event branding with TukTix badge. Exciting and engaging.
Logo Usage for Social
Full Horizontal Logo
Use for headers, wide banners, and YouTube thumbnails.
Logo Mark (Icon Only)
Use for profile pictures, app icons, and story highlights.
Placement Rules
Content Pillars
Do's and Don'ts
Do
Don't
Post Sample Mockup
tuktix_official Get ready for the biggest night of the year! 🎸🔥 #TukTix #LiveMusic