Cost Center Allocations

Allocate shared expenses across departments using rules, review summaries, and export allocation reports.

Overview

This app helps finance and FP&A teams distribute overhead and shared costs to cost centers. Enter expenses in an AG Grid with allocation percentages for Sales, Marketing, Engineering, Operations, and G&A. Apply allocation rules — equal split, headcount-based, or revenue-based — to one expense or all at once. KPI cards and a summary table show totals per cost center; doughnut and bar charts visualize the breakdown. Excel import and export support month-end reporting. Everything runs in a single self-contained HTML page with data saved locally in your browser.

Key features

Expense grid

• AG Grid tracker — Expense name, category, amount, and allocation % per department with total % validation.
• Sample data — Eight shared expenses totaling over $98K across IT, facilities, marketing, and other categories.
• Row highlighting — Invalid rows (total % ≠ 100) are flagged; selected expense is highlighted.

Allocation rules

• Rule types — Equal split, headcount-based, revenue-based, or keep custom percentages.
• Auto-calculation — Apply a rule to the selected expense or all expenses at once.
• Selected expense panel — Shows per-department % and dollar amounts for the active row.
• Department drivers — Headcount and revenue % weights displayed when using driver-based rules.

Summary by cost center

• KPI cards — Total expenses, total allocated, valid row count, and top cost center.
• Summary table — Headcount, revenue %, allocated amount, and share % for each department.

Charts & reporting

• Doughnut chart — Allocation breakdown by cost center.
• Bar chart — Total expenses grouped by category.
• Excel export — Expenses sheet with per-department % and $ columns plus By Cost Center summary sheet.

Data management

• Excel import — Load expenses with allocation columns from a spreadsheet.
• localStorage — All expenses and selection persist across sessions.
• Reset data — Restore sample dataset with confirmation.
• Dark mode — Toggle light/dark theme; AG Grid and Chart.js adapt; preference is remembered.

Data & persistence

Sample data includes eight expenses allocated across five departments using varied percentage splits. State saves to `localStorage` under `cost-center-allocations-data` and `cost-center-allocations-dark`.

Charts & reporting

The doughnut chart shows dollar allocation per cost center from valid (100%) rows. The bar chart aggregates expense amounts by category. Excel export includes full allocation detail and a per-department summary with share percentages.

Built with

Tailwind CSS (CDN), AG Grid Community, Alpine.js, Chart.js, and SheetJS — all loaded from CDN in a single HTML file.

Try the interactive walkthrough below. Click Walk through features and use Next / Back (or arrow keys) to explore every feature.