Monthly Spending Breakdown - Lunch Money

After lots of iterations, this is the first published design of the monthly spending breakdown on Lunch Money (https://lunchmoney.app)

On hover, the bar in the top stacked graph will expand and the associated table row will highlight. There are also settings accessible from the top right cog to adjust the data per user preference (for example, see spending against total or against budgeted spend).

Overall, feedback from Lunch Money users have been very positive for this design. A lot have even requested that this view be accessible for different months (the first iteration only showed data for the current month).