← All templates

Report View

Monthly expense report with summary metrics and a budget-variance table.

Dashboard
Open in editor →
Start typing to see your wireframe…

The Wiremark source

This is the entire template — edit it live in the editor, or paste it into any .wiremark file.

wiremarkUI
  sidebar SD {
    nav "Dashboard"
    nav "Reports" active
    nav "Scheduled"
    nav "Archive"
  }
  header H "Reports"

  page REPORT "Monthly Report" {
    H
    SD

    toolbar {
      select "January 2024"
      select "All departments"
      button "Schedule"
      button "Download PDF" primary
    }

    grid "Summary" {
      metric "Total Expenses" "$124,800"
      metric "Budget Remaining" "$23,200"
      metric "Transactions" "1,048"
      metric "Over-budget Items" "3"
    }

    section "Expense Breakdown" {
      table "By Category" {
        columns "Category", "Budget", "Actual", "Variance", "Status"
        row "Engineering", "$60,000", "$58,400", "-$1,600", "Under"
        row "Marketing", "$25,000", "$29,300", "+$4,300", "Over"
        row "Operations", "$20,000", "$19,800", "-$200", "Under"
        row "HR", "$15,000", "$17,300", "+$2,300", "Over"
      }
    }
  }