UI Developer
Lahore, Punjab Pakistan, Pakistan
Full Time
Mid Level
We're hiring a UI Developer with deep Tailwind CSS v4 and Bootstrap 5 expertise to build and maintain a large-scale Arabic fintech platform built on Nuxt 4 + Vue 3. This is a pure UI role — you'll work closely with designers, uphold strict visual standards, and deliver pixel-perfect components from Figma across a bilingual RTL/LTR design system.
Key Responsibilities:
- Build and maintain UI components with token-based theming, strict design system conventions, and minimal arbitrary values
- Implement pixel-perfect Figma designs with full RTL/LTR support — Arabic is the default language and direction
- Enforce and uphold coding standards: Tailwind config architecture, custom token usage, class ordering, and utility-first patterns
- Refactor and migrate legacy Bootstrap/SCSS to pure Tailwind — maintaining functionality while replacing the entire style layer
- Contribute to and maintain a shared component library covering inputs, modals, charts, animations, and shimmers
- Ensure WCAG 2.2 AA accessibility, cross-browser compatibility, and frontend performance across all breakpoints (xs → 2xl)
Required Skills:
- Strong command of Tailwind CSS v4 and Bootstrap 5 — config customization, design tokens, plugins, and extending the design system
- Deep understanding of CSS logical properties for RTL/LTR (margin-inline, padding-inline, inset-inline) — never physical left/right/ml/mr
- Ability to translate Figma designs into pixel-perfect, responsive, RTL-first layouts without inline styles or SCSS
- Token discipline: use design tokens for every color, spacing, and typography value — never raw hex, never arbitrary values when a token exists
- i18n experience — all strings via translation keys, full bilingual (Arabic/English) UI without direction-specific code branches
- Solid understanding of semantic HTML, ARIA, keyboard navigation, and WCAG 2.2 AA
Nice to Have:
- Experience with ECharts, Lottie, or Rive animations
- Experience with multi-theme systems (light/dark/branded themes via CSS custom properties)
Key Responsibilities:
- Build and maintain UI components with token-based theming, strict design system conventions, and minimal arbitrary values
- Implement pixel-perfect Figma designs with full RTL/LTR support — Arabic is the default language and direction
- Enforce and uphold coding standards: Tailwind config architecture, custom token usage, class ordering, and utility-first patterns
- Refactor and migrate legacy Bootstrap/SCSS to pure Tailwind — maintaining functionality while replacing the entire style layer
- Contribute to and maintain a shared component library covering inputs, modals, charts, animations, and shimmers
- Ensure WCAG 2.2 AA accessibility, cross-browser compatibility, and frontend performance across all breakpoints (xs → 2xl)
Required Skills:
- Strong command of Tailwind CSS v4 and Bootstrap 5 — config customization, design tokens, plugins, and extending the design system
- Deep understanding of CSS logical properties for RTL/LTR (margin-inline, padding-inline, inset-inline) — never physical left/right/ml/mr
- Ability to translate Figma designs into pixel-perfect, responsive, RTL-first layouts without inline styles or SCSS
- Token discipline: use design tokens for every color, spacing, and typography value — never raw hex, never arbitrary values when a token exists
- i18n experience — all strings via translation keys, full bilingual (Arabic/English) UI without direction-specific code branches
- Solid understanding of semantic HTML, ARIA, keyboard navigation, and WCAG 2.2 AA
Nice to Have:
- Experience with ECharts, Lottie, or Rive animations
- Experience with multi-theme systems (light/dark/branded themes via CSS custom properties)
What we offer:
- Annual Increment
- Annual Performance Bonus
- Provident Fund
- Medical OPD/IPD/Maternity
- Social Insurance
- Paid Leaves
- Leave Encashment
- Paid Certifications
- Engagement Activities
- Reward & Recognition
- Corporate Gifts
- Annual Tour
- Team Hangouts
- Collaborative & Fostering Culture
Apply for this position
Required*