QwikTime Brand Hub
Consistent, clean, and human. Everything you need to use QwikTime brand correctly.
Logos & App Icons
Color Palette
Fundamental palettes in multiple steps (50-950). Click any swatch to copy the HEX code.
Blue
#EFF6FF
#DBEAFE
#BFDBFE
#93C5FD
#60A5FA
#3B82F6
#2563EB
#1D4ED8
#1E40AF
#1E3A8A
Orange
#FFF7ED
#FFEDD5
#FED7AA
#FDBA74
#FB923C
#F97316
#EA580C
#C2410C
#9A3412
#7C2D12
Grey
#F9FAFB
#F3F4F6
#E5E7EB
#D1D5DB
#9CA3AF
#6B7280
#4B5563
#374151
#1F2937
#111827
Green
#F0FDF4
#DCFCE7
#BBF7D0
#86EFAC
#4ADE80
#22C55E
#16A34A
#15803D
#166534
#14532D
Red
#FEF2F2
#FEE2E2
#FECACA
#FCA5A5
#F87171
#EF4444
#DC2626
#B91C1C
#991B1B
#7F1D1D
Yellow
#FEFCE8
#FEF9C3
#FEF08A
#FDE047
#FACC15
#EAB308
#CA8A04
#A16207
#854D0E
#713F12
Purple
#FAF5FF
#F3E8FF
#E9D5FF
#D8B4FE
#C084FC
#A855F7
#9333EA
#7E22CE
#6B21A8
#581C87
Cyan
#ECFEFF
#CFFAFE
#A5F3FC
#67E8F9
#22D3EE
#06B6D4
#0891B2
#0E7490
#155E75
#164E63
Pink
#FDF2F8
#FCE7F3
#FBCFE8
#F9A8D4
#F472B6
#EC4899
#DB2777
#BE185D
#9D174D
#831843
Text Styles
QwikTime uses the Inter typeface family for UI and marketing. These text styles follow the website's hierarchy and should be applied consistently in headings, paragraphs, buttons, and components.
Style | Specs | Preview |
---|---|---|
Body | Font size: 16px Line height: 22px |
Body Regular Body Medium |
Heading 1 | Font size: 32px Line height: 38px |
Heading 1 Medium Heading 1 SemiBold |
Heading 2 | Font size: 28px Line height: 34px |
Heading 2 Bold Heading 2 SemiBold |
Heading 3 | Font size: 24px Line height: 30px |
Heading 3 Bold Heading 3 Medium |
Heading 4 | Font size: 20px Line height: 26px |
Heading 4 Bold Heading 4 SemiBold |
Subtitle | Font size: 14px Line height: 20px |
Subtitle Regular Subtitle Medium |
Caption | Font size: 12px Line height: 18px |
Caption Medium Caption Regular |
Working Rules
Do
- Use the provided SVG logos whenever possible for crisp scaling.
- Maintain minimum clear space equal to the height of the "Q" around the logo.
- Prefer QT Blue for primary actions and links.
- Check color contrast (WCAG AA+) for text on backgrounds.
Don't
- Do not stretch, skew, or add effects to the logo.
- Do not place light logo on light backgrounds (or dark on dark) without adequate contrast.
- Do not invent new colors or gradients outside this palette.
Questions or custom assets?
Email Marketing
Contact Tracy Winson marketing@qwiktime.net
Social Media Kits