1 — Default Pill Tabs
HR Dashboard Tabs
Solid filled pill on active tab
128
Total Employees
94.3%
Attendance
14
Pending Leave
12
Reviews Due

High-level snapshot of all HR activities this month. Team headcount up 12 from last month. Twelve performance reviews due by December 20.

SC
Sarah Chen
Senior UX Designer · Product
94
MJ
Marcus Johnson
Backend Engineer · Engineering
88
PN
Priya Nair
Product Manager · Product
91
Gross Pay
₹1.58Cr
Deductions
₹34L
Net Disbursed
₹1.24Cr
Status
Processed

December 2024 payroll processed on Dec 28. Payslips emailed to all 128 employees.

Email Notifications
Leave requests, payroll, performance alerts
Two-Factor Authentication
Require MFA for all admin accounts
Auto Payroll Processing
Process payroll on last working day automatically
2 — Underline / Classic Tabs
Underline Indicator
Bottom border marks the active tab — no background

Dashboard: Real-time KPIs — 128 employees, 94.3% attendance, ₹1.24Cr payroll, 7 open positions. Performance average for Q4: 88.2/100 across all departments.

Analytics: 30+ pre-built workforce reports. Attrition trend –2.1% vs Q3. Hiring velocity: 12 hires in 30 days. Cost-per-hire: ₹84,000. Drill down by squad, level, and region.

Reports: 6 scheduled reports delivered to leadership every Monday — payroll summary, attendance heatmap, leave balance, and performance percentile distribution. Export in PDF, Excel, or CSV.

Compliance: PF filings current through November 2024. TDS Form 24Q submitted Q2. ESIC 100%. DPDP Act data-retention review due March 2026. SOC 2 Type II renewed.

3 — Segmented Control
Button-Group Tabs
Compact grouped toggle — view-switcher style
12
New Hires
2
Departures

December 2024 — net headcount +10. On track for Q1 2025 hiring targets.

34
New Hires
8
Departures

Q4 2024 — net +26. Attrition 6.25%, below industry average of 12%.

92
New Hires
22
Departures

FY 2024 — net +70. YoY headcount growth 120%. Retention rate: 92.4%.

4 — Pill Outline Tabs
Outlined Pill Tabs
Border-only until clicked, then fills solid

128 employees across 6 departments. Average tenure 2.8 years. Gender ratio 54/46. 92% permanent, 8% contract. Average age 31.4 years.

42 engineers across Backend, Frontend, DevOps, and QA. Sprint 24 on track. Average performance 87.6/100. 3 open senior roles in active recruitment.

18 product team members including PMs, designers, and researchers. 8 active product initiatives. Q4 review avg 91/100. 2 promotions pending approval.

HR: 12 specialists handling recruitment, payroll, and compliance. Finance: 8 team members. Both departments fully staffed. Year-end audit complete with zero findings.

5 — Icon + Label Tabs
Icon Tabs
Icon stacked above label — great for feature-dense navigation bars

Team view: Browse 128 employees by department, role, or status. Org chart with reporting lines available. People Search for quick contact lookup.

Attendance: 94.3% average this month. 14 late arrivals flagged. 3 employees on unplanned leave today. Geo-fenced check-in enabled for all remote staff.

Payroll: December ₹1.24Cr disbursed. All 128 payslips generated and emailed. PF, ESI, TDS computed per latest statutory rates. Next run: January 28.

Performance: Q4 2024 reviews in progress. 68 of 128 employees submitted self-assessments. Average so far: 88.2/100. Reviews close December 20.

Settings: Configure leave policies, notification preferences, payroll frequency, role permissions, and third-party integrations. Last updated December 10.

6 — Vertical Tabs
Vertical Side Tabs
Tab list left, content right
Personal Info
Full NameSarah Chen
Emailsarah.chen@hr.com
Phone+91 98765 43210
LocationBangalore, IN
Employment
DepartmentProduct
RoleSr UX Designer
Start DateMar 15, 2021
Reports ToJames Park
Security
Two-Factor Auth
Enabled
Last Login
Dec 14, 9:15 AM
Notifications
Leave requests
Payroll alerts
Review reminders
7 — Badge / Count Tabs
Notification Badge Tabs
Red badge shows pending item count
SC
Sarah Chen — Annual Leave
Dec 23–27 · 3 days · 2h ago
MJ
Marcus Johnson — Sick Leave
Dec 16 · 1 day · Medical cert attached

12 performance reviews pending manager submission. Deadline December 20. Team leads notified. 6 self-assessments still incomplete — reminder sent today.

3 expense claims pending CFO approval: Tom Nakamura (travel ₹18,200), Emily Rodriguez (training ₹12,500), David Kim (equipment ₹28,900). Total pending: ₹59,600.

No unread messages. Last message from James Park (Dec 14): "Budget review meeting moved to Dec 18 at 2 PM."

8 — Card / Boxed Tabs
Card-Lid Tabs
Each tab looks like a card lid connected to the content below
SC
Sarah Chen
Senior UX Designer · 3 yrs 9 months
Checked in at 9:03 AM via web — Dec 14
Submitted self-assessment for Q4 review — Dec 12
Leave approved Dec 23–27 (3 days) — Dec 10
Offer Letter — March 2021.pdf124 KB
Q4 Performance Review.docx38 KB
Payslip Dec 2024.pdf56 KB
Q4 Review Submission
Dec 20
Holiday Party — 6 PM
Dec 22
Annual Leave Begins
Dec 23
9 — Colour-Coded Tabs
Category Colour Tabs
Each tab gets its own accent colour

Total workforce 128. Active: 112. On leave: 9. Pending onboarding: 4. Exit process: 3. Headcount up 12% YoY.

112 Active — all checked in today. 6 working remotely. Core hours 10 AM–3 PM observed across all timezones.

9 On Leave — 5 annual, 2 sick, 2 paternity. All approved and coverage arranged. Return dates confirmed.

3 flagged — 1 attendance violation, 1 PIP active, 1 exit notice served. HR follow-up scheduled.

10 — Scrollable Tab Bar
Horizontally Scrollable
Overflows with scroll on small screens — no wrapping

January: 12 new hires, payroll ₹1.18Cr, attendance 93.1%. Q1 planning sessions began.

February: 8 hires, payroll ₹1.19Cr, attendance 91.8%. 2 senior departures.

March: 15 hires, payroll ₹1.21Cr, attendance 95.2%. Holi holiday. Q1 reviews complete.

April: 11 hires, payroll ₹1.22Cr, attendance 94.5%. Hybrid policy fully in effect.

May: 9 hires, payroll ₹1.22Cr, attendance 93.7%. Company offsite in Goa.

June: 14 hires, payroll ₹1.23Cr, attendance 94.0%. H1 performance reviews. SOC 2 audit complete.

July: 6 hires, payroll ₹1.23Cr, attendance 92.3%. 2 promotions effective Jul 1.

August: 10 hires, payroll ₹1.24Cr, attendance 94.8%. New engineering squad formed.

September: 13 hires, payroll ₹1.24Cr, attendance 95.1%. Q3 reviews kicked off.

October: 7 hires, payroll ₹1.24Cr, attendance 93.5%. Diwali holiday. Annual appraisals announced.

November: 9 hires, payroll ₹1.24Cr, attendance 94.2%. Salary increments effective Dec 1.

December: 12 hires, payroll ₹1.24Cr, attendance 94.3%. Q4 reviews + holiday party Dec 22.

11 — Nested Tabs
Parent Tabs with Child Tab Sets
Each parent section contains its own independent child tab group

Backend: 12 engineers, Node.js + PostgreSQL + Redis. Sprint 24 — 9 in progress, 3 in review. Average score 87/100.

Frontend: 10 engineers, React 18 + TypeScript. Sprint 24 — 7 tickets closed. Component library migration 80% complete. Average score 88/100.

DevOps: 8 engineers, AWS EKS + Terraform. Uptime 99.97% MTD. Cost savings 28% vs Q3. Average score 91/100.

Product Management: 5 PMs across 4 product lines. Q1 roadmap finalised. AI features scoped for H1 2025. Average score 89/100.

Design: 8 designers (UX, UI, research). Design system v3.0 shipped. 6 user-testing sessions this month. Average score 94/100.

Recruitment: 7 open roles, 42 applications this week, 3 offers extended. Time-to-hire avg: 28 days. Cost-per-hire: ₹84,000.

Payroll: 4 specialists. December payroll closed on time, zero errors. PF/ESI/TDS fully compliant. Next review: Jan 5, 2025.

12 — Step / Wizard Tabs
Wizard Step Indicator
Visual stepper — click numbered steps or use Next/Back buttons
1
Personal
2
Employment
3
Compensation
4
Review
Summary
NameSarah Chen
RoleUX Designer · Product
Start DateJan 15, 2026
CTC₹75,000 / month
Welcome email with login credentials will be sent to sarah.chen@hrnexus.com on Start Date.