Peeplynx Design System

A calm, premium SaaS system for HR credibility and product clarity.

Peeplynx should feel credible for HR leaders, modern enough for software buyers, and calm enough for operations-heavy workflows. The visual language leans editorial in typography and precise in layout, with soft warmth to avoid a cold enterprise feel.

Visual Tone

Minimal, SaaS premium, clean dashboards

Icon Style

Simple outlined or dual-tone icons with rounded geometry, subtle fills, and consistent 1.5-1.75px strokes.

Illustration Direction

Use abstract dashboard snippets, data tiles, workflow diagrams and lightly humanized workplace scenes rather than stock-photo-heavy compositions.

Foundations

Color, typography and spacing work like product tokens, not one-off styles.

The system is built for consistency across landing pages, module pages, pricing surfaces and future blog templates.

Color Palette

Canvas
#F7F4EC
Surface
#FFFFFF
Ink
#12232F
Muted
#60707D
Teal
#0F766E
Deep Teal
#0B4F49
Mint
#C6EFE8
Signal Gold
#F4C95D

Typography Scale

display-xl
4.5rem desktop / 3rem mobile
Hero H1
display-lg
3.5rem desktop / 2.5rem mobile
Page H1
heading-xl
3rem desktop / 2.25rem mobile
Section H2
heading-lg
2rem desktop / 1.75rem mobile
Feature card titles / H3
body-lg
1.125rem desktop / 1rem mobile
Lead paragraphs
body-md
1rem desktop / 1rem mobile
Default paragraphs
body-sm
0.9375rem desktop / 0.9375rem mobile
Supporting copy and forms
label-xs
0.75rem desktop / 0.75rem mobile
Eyebrows, nav meta, badges

Spacing System

space-2
0.5rem
Dense inline gaps
space-3
0.75rem
Button / chip spacing
space-4
1rem
Card body rhythm
space-6
1.5rem
Component padding
space-8
2rem
Section internals
space-10
2.5rem
Hero and CTA grouping
space-16
4rem
Mobile section padding
space-24
6rem
Desktop section padding

Buttons

Primary: High-intent actions like demo booking. Dark ink fill, white text, rounded-full, lift on hover.

Secondary: Evaluation actions like feature exploration. White surface, ink border, high-contrast text.

Ghost: Low-friction header/footer actions. Transparent background, text-first emphasis.

Form Styles

Rounded 18-20px fields, soft slate background, 1px border, strong focus state using ink instead of bright blue.

Components

Core cards and layout pieces stay consistent from homepage to pricing.

Reusable surfaces help the site scale without feeling repetitive or template-driven.

Glass panel

Feature cards, testimonial cards, proof stats, nav-adjacent surfaces.

Dark emphasis card

Hero analytics preview, CTA block, featured pricing plan.

Plain surface card

Forms, list modules, workflow details, dense content areas.

Sticky, compact, translucent shell with strong CTA on the right. The nav should feel product-led, not corporate-heavy.

Three-column footer with fast navigation, modules, and company proof. Keep it quiet, clean, and credibility-focused.

Live Components

Reusable React sections for the Peeplynx marketing system.

These are the actual building blocks used across the site.

Streamline your HR operations with one powerful solution.

Unify your entire workforce lifecycle. Empower your HR team to spend less time chasing data across disconnected systems, and more time leading your people.

Workforce CentralLeave ManagementPerformanceAttendance ManagementConnect DeskManpower Planning
Peeplynx HR dashboard on MacBook

Workforce

Workforce Central

Manage the complete employee lifecycle — enrolment, onboarding, probation, contract, exit and deboarding — with structured profiles, critical data controls and configurable master data.

  • Enrolment and onboarding
  • Employee lifecycle actions
  • Exit and deboarding
Explore module →

Leave

Leave Management

Configure leave types with granular applicability rules, define accrual and balance policies, automate approvals and administer leave balances across your organization.

  • Configurable leave types and policies
  • Self-service requests and approvals
  • Leave administration
Explore module →

Performance

Performance Management

Turn performance reviews into a predictable management rhythm with structured cycles, goal tracking, 360° reviews and manager accountability.

  • Review cycle builder
  • Goal visibility
  • Calibration support
Explore module →

Connect Desk

Connect Desk

Centralize internal HR requests with workflow-based ticketing, SLA tracking and department-wise approval routing — replacing scattered email threads and informal processes.

  • Workflow-based ticketing
  • SLA and escalation tracking
  • Department-wise routing
Explore module →

Attendance

Attendance Management

Manage shifts, regularization, on duty and optional holiday requests with structured approval workflows — giving HR full visibility across attendance and exceptions.

  • Employee self-service requests
  • Shift calendar and attendance view
  • Configurable shift and request settings
Explore module →

Manpower

Manpower Management

Plan headcount, manage open positions and align recruitment with business demand — one connected workspace for workforce planning, position control and hiring requests.

  • Headcount and position planning
  • Manpower request workflow
  • Recruitment and budget hand-off
Explore module →

L&D

Learning & Development

Build learning paths, deliver training programs and track skill development — one connected workspace for onboarding, compliance and continuous upskilling.

  • Course catalogue and learning paths
  • Assignment and progress tracking
  • Certifications and skill records
Explore module →

Peeplynx gave us one connected HR system. Leave tracking, performance reviews and employee records now run from the same place — which changed how our managers operate.

Riya S.
Head of People, B2B Services Firm

Our managers finally have a clean workflow for approvals, leave requests and performance check-ins instead of relying on scattered email threads.

Marcus N.
COO, Mid-Market Manufacturing Group

The full lifecycle approach stood out — from onboarding a new hire to tracking their learning progress and performance, it's all connected in one place.

Elena P.
Talent Director, Regional Tech Company

Essential HR

Core HR for teams replacing manual processes and spreadsheets.

₹50/ user / mo
  • Workforce Central
  • Leave Management
  • Attendance Management
  • Employee self-service
Popular

Elevate HR

For growing teams adding performance reviews and service workflows.

₹100/ user / mo
  • Everything in Essential HR
  • Performance Management
  • Connect Desk
  • Advanced analytics

Scale HR

For complex organizations with planning and recruitment needs.

₹150/ user / mo
  • Everything in Elevate HR
  • Manpower planning
  • Recruitment workflows
  • Custom implementation support

Elite HR

Full platform access with priority support and custom capabilities.

₹200/ user / mo
  • Everything in Scale HR
  • Priority success management
  • Custom chatbot add-on
  • Dedicated rollout team

Pricing disclaimer: All prices are in Indian Rupees (₹) and are per user per month, exclusive of applicable taxes. A minimum monthly charge applies regardless of team size. Prices are subject to change; existing subscribers will be notified in advance of any revisions. Annual billing is calculated as the discounted monthly rate × 12. For custom enterprise pricing, volume discounts, or multi-entity deployments, please contact our sales team.

Use this system to scale new pages without losing brand sharpness.

The same components can support product pages, feature hubs, blog CTAs, pricing comparisons and demo capture flows.