Logo Variations
Four distinct logo variations designed for different use cases and backgrounds.
Primary Logo
Main logo with beacon icon, white "LUMEN" and gold "LEADS". Use on dark backgrounds.
Icon Only
Standalone beacon icon in gold. Perfect for favicons, app icons, and compact spaces.
Light Version
Dark version for light backgrounds. Features dark beacon and text with gold "LEADS".
Wordmark Only
Text-only version without icon. Use when space is limited or icon is displayed separately.
Logo Usage Guidelines
Minimum Size
24px height for icon, 32px height for full logo
Clear Space
Maintain distance equal to the height of the beacon icon
File Formats
SVG (preferred), PNG with transparent background
Brand Guidelines
Color Palette
Primary Dark
#0A0E1A
--primary-dark
Main background, primary brand color
Gold Accent
#F59E0B
--gold
CTAs, highlights, brand accent
Dark Gold
#D97706
--gold-dark
Hover states, secondary gold
Card Background
#1E293B
--card
Component backgrounds, cards
Border
#334155
--border
Borders, dividers, outlines
Text White
#FFFFFF
--text-white
Primary text, headings
Text Body
#CBD5E1
--text-body
Body text, descriptions
Text Muted
#94A3B8
--text-muted
Secondary text, captions
Typography
Font Family
Inter - A modern, clean sans-serif typeface
font-family: 'Inter', sans-serif
Headings
Heading 1
text-6xl font-bold
Heading 2
text-4xl font-bold
Heading 3
text-2xl font-semibold
Heading 4
text-xl font-medium
Body Text
Large body text for prominent descriptions and important information.
text-lg text-text-body
Regular body text for general content, descriptions, and paragraph text.
text-base text-text-body
Small text for captions, footnotes, and secondary information.
text-sm text-text-muted
Button Styles
Primary Buttons
Secondary Buttons
Button States
Card Components
Basic Card
Standard card with basic styling, border, and padding. Perfect for content sections and feature highlights.
Featured Card
Premium card with gradient background and gold accent border. Used for highlighting important content.
Media Card
Card with header image or media content. Great for showcasing visual content.
Status Card
Card with status indicator. Useful for dashboards and status updates.
Usage Guidelines
✓ Do
- • Use high contrast for readability
- • Maintain consistent spacing
- • Use gold accent sparingly for emphasis
- • Follow the established typography hierarchy
- • Keep the beacon icon recognizable
- • Use Inter font family consistently
✗ Don't
- • Use low contrast color combinations
- • Overuse the gold accent color
- • Modify the logo proportions
- • Use more than 3 font weights
- • Place text on busy backgrounds
- • Use colors outside the brand palette
Email Signature
Preview
|
LUMENLEADS
Chiya Yosupov
Founder
Premium Legal Lead Generation • Connecting Legal Professionals with High-Value Opportunities
|
HTML Code
<table style="border-collapse: collapse; margin: 0; padding: 0; font-family: 'Inter', Arial, sans-serif; font-size: 14px; line-height: 1.4; color: #0A0E1A;">
<tr>
<td style="padding: 0; margin: 0;">
<div style="display: flex; align-items: center; margin-bottom: 12px;">
<svg width="24" height="24" viewBox="0 0 64 64" style="margin-right: 8px;">
<defs>
<radialGradient id="emailGlow" cx="50%" cy="20%" r="60%">
<stop offset="0%" stop-color="#FEF3C7" stop-opacity="0.8"/>
<stop offset="100%" stop-color="#FEF3C7" stop-opacity="0"/>
</radialGradient>
<linearGradient id="emailBeacon" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#F59E0B"/>
<stop offset="100%" stop-color="#D97706"/>
</linearGradient>
</defs>
<circle cx="32" cy="20" r="20" fill="url(#emailGlow)"/>
<path d="M32 8 L30 2 L34 2 Z" fill="#FDE68A" opacity="0.7"/>
<path d="M24 12 L18 6 L20 4 Z" fill="#FDE68A" opacity="0.7"/>
<path d="M40 12 L46 6 L44 4 Z" fill="#FDE68A" opacity="0.7"/>
<path d="M18 20 L12 18 L12 22 Z" fill="#FDE68A" opacity="0.7"/>
<path d="M46 20 L52 18 L52 22 Z" fill="#FDE68A" opacity="0.7"/>
<rect x="26" y="45" width="12" height="15" rx="1" fill="#D97706"/>
<rect x="28" y="35" width="8" height="12" rx="1" fill="#F59E0B"/>
<rect x="29" y="25" width="6" height="12" rx="1" fill="url(#emailBeacon)"/>
<ellipse cx="32" cy="18" rx="4" ry="3" fill="#F59E0B" style="filter: brightness(1.3)"/>
<ellipse cx="32" cy="18" rx="2" ry="1.5" fill="#FEF3C7"/>
</svg>
<div style="font-weight: 800; font-size: 16px; letter-spacing: 2px;">
<span style="color: #0A0E1A;">LUMEN</span><span style="color: #D97706;">LEADS</span>
</div>
</div>
<div style="margin-bottom: 8px;">
<div style="font-weight: 600; font-size: 16px; color: #0A0E1A; margin-bottom: 2px;">
Chiya Yosupov
</div>
<div style="font-size: 14px; color: #64748B; margin-bottom: 8px;">
Founder
</div>
</div>
<div style="margin-bottom: 12px;">
<div style="margin-bottom: 4px;">
<span style="color: #64748B; font-size: 13px;">Email: </span>
<a href="mailto:leads@lumenleads.live" style="color: #D97706; text-decoration: none; font-weight: 500;">leads@lumenleads.live</a>
</div>
<div style="margin-bottom: 4px;">
<span style="color: #64748B; font-size: 13px;">Phone: </span>
<a href="tel:3509006113" style="color: #D97706; text-decoration: none; font-weight: 500;">350-900-6113</a>
</div>
<div>
<span style="color: #64748B; font-size: 13px;">Web: </span>
<a href="https://lumenleads.live" style="color: #D97706; text-decoration: none; font-weight: 500;">lumenleads.live</a>
</div>
</div>
<div style="font-size: 12px; color: #94A3B8; font-style: italic; border-top: 1px solid #E2E8F0; padding-top: 8px;">
Premium Legal Lead Generation • Connecting Legal Professionals with High-Value Opportunities
</div>
</td>
</tr>
</table>Setup Instructions
Gmail:
- Go to Gmail Settings → General → Signature
- Click "Create new" to add a new signature
- Switch to HTML mode (if available) or paste directly
- Copy and paste the HTML code above
- Save changes
Outlook:
- Go to File → Options → Mail → Signatures
- Click "New" to create a new signature
- In the signature editor, paste the HTML code
- Set as default for new messages and replies
- Click OK to save
Apple Mail:
- Go to Mail → Preferences → Signatures
- Select your email account and click "+"
- In the signature editor, paste the HTML code
- Close preferences to save
Note: The signature uses inline CSS for maximum compatibility across email clients. Some clients may strip certain styles, but the core information will remain intact and professional.
Social Media Assets
Professionally designed social media assets with correct dimensions for all major platforms.
Social Media Assets
Profile Picture (400×400)
Facebook Cover (820×312)
LinkedIn Banner (1128×191)
Twitter Header (1500×500)
Premium Legal Lead Generation
Connecting Legal Professionals with High-Value Opportunities
Google Business (720×720)
Legal Lead Generation
Premium • Vetted • Guaranteed ROI
Social Media Specifications