Cost Estimation Calculator
Estimate project costs with min/max/estimate ranges across multiple line items.
How to Use
- Enter a description for each cost line item.
- Fill in the minimum, maximum, and estimated values for each row.
- Add more rows with the 'Add Row' button.
- The Totals row at the bottom sums all three columns automatically.
- Use 'Copy Summary' to copy the estimate to your clipboard.
Features
- Multiple line items with min / max / estimate columns
- Real-time totals row
- Add or delete rows dynamically
- Copy formatted summary to clipboard
- Clear all rows with one click
- 100% browser-based — data stays on your device
FAQs
What is the Cost Estimation Calculator?
It lets you add multiple line items for a project, each with a minimum, maximum, and estimated cost. It totals all three columns so you can see best case, worst case, and expected cost at a glance.
How do I add more rows?
Click the 'Add Row' button to append a new line item. You can add as many as you need.
Can I copy the estimate summary?
Yes — click 'Copy Summary' to copy a formatted text summary of all line items and totals to your clipboard.
Is my data saved?
No. All data exists only in your browser's memory and is lost when you close or refresh the page. Nothing is sent to any server.
Technical Details
The cost estimator maintains an array of row objects in React state, each containing description, min, max, and estimate strings. Column totals are computed on each render by reducing the array with parseFloat, defaulting to 0 for empty fields. Rows are added by appending new objects with crypto.getRandomValues()-based IDs; deletion uses Array.filter. The copy-summary function serializes the table to a plain-text columnar format using String.padEnd/padStart for alignment.