Opportunity
Senior Product Designer
Remote · Full-time · Beirut / Paris collaboration
UI Kit · Design System
Theme:
- High-contrast editorial feel: white/light-gray surfaces with strong dark text.
- Primary accent appears on major calls-to-action and active states.
- Softened edges with consistent radius tokens: cards (1rem), inputs (0.75rem), buttons/badges (pill).
- Simple type hierarchy: bold headings, compact uppercase labels, practical forms.
Color Palette
Primary
--color-life-red
Primary Hover
--color-life-red-hover
Primary Soft
--color-life-red-soft
Ink
--color-life-ink
Paper
--color-life-paper
Muted Surface
--color-life-muted
Line
--color-life-line
Typography
Heading 1 — Page title (text-3xl bold)
Heading 2 — Section title (text-2xl bold)
Heading 3 — Card title (text-xl semibold)
Heading 4 — Card subtitle (text-lg bold)
Body text — Secondary descriptive content (text-sm zinc-700)
Eyebrow label — Category / type indicators
Form label — .life-label class
Micro label — metadata and annotations
Buttons
Small button variant (used in card footers):
Inputs & Form Elements
Pill Tags & Badges
Beirut, LebanonFull-timeVue.jsTypeScript5+ yearsRemote
Score Rings & Match Tiers
SVG score rings with tier-based coloring. Used in JobMatchCard and CandidateMatchCard.
Excellent
85-100
Strong
70-84
Moderate
50-69
Low
0-49
Cards / Listing Preview
Insight
Design guidance
Keep interfaces strict, clear, and utility-focused with restrained visual ornamentation.
JobMatchCard Component
Live component used on the candidate matches page.
Excellent match82% skill overlap
Full-time
Senior Frontend Engineer
TechCorp Beirut
Beirut, LebanonHybridVue.jsTypeScriptTailwind
Why this matches
5+ years of Vue.js experience matches requirement
- 5+ years of Vue.js experience matches requirement
- Strong TypeScript proficiency
- Location preference aligns with office
Moderate match55% skill overlap
Contract
Product Designer
DesignLab MENA
RemoteFlexibleFigmaUX Research
Partial skill overlap with design tools
- Partial skill overlap with design tools
CandidateMatchCard Component
Live component used on the employer candidate matches page.
Excellent match85% skill overlap
LK
Layla Khoury
Full-Stack Developer
Beirut, Lebanon6 yearsImmediateMaster's CS
ReactNode.jsPostgreSQLDockerAWS
Why this matches
Strong backend and frontend experience
- Strong backend and frontend experience
- Cloud deployment expertise matches needs
- Located in target market
Low match30% skill overlap
OF
Omar Farhat
Junior Data Analyst
Tripoli, Lebanon1 year2 weeksBachelor's
ExcelSQLPython
Why this matches
Basic SQL knowledge relevant to role
- Basic SQL knowledge relevant to role
AuthRoleTabs Component
Segmented toggle for candidate/employer role selection. Used on login and signup pages.
Selected: candidate
SocialAuthButtons Component
Social login buttons used on login and signup pages. Demo-only (no real OAuth).
CandidateProfile Component
Full candidate intake form with validation and JSON preview. Uses .life-input, .life-label, and .life-btn classes throughout.
Candidate intake
Candidate Profile
Structured applicant information using the new LIFE-inspired design system baseline.
Avatar Initials
Used in CandidateMatchCard when no photo is available.
AF
LK
RH
Radius Tokens
Card (1rem)
Input (0.75rem)
Pill (999px)