Dashboard UI Kit for EU SaaS Billing — VAT ID, Reverse Charge & OSS States

For SaaS founders and product designers in the EU who invoice business and consumer customers in other EU countries. Enter one invoice: the kit state, VAT line and invoice wording appear on the right.

Standard rates prefilled: AT 20 · BE 21 · DE 19 · DK 25 · ES 21 · FR 20 · IE 23 · IT 22 · NL 21 · PL 23 · PT 23 · SE 25. Reduced rates are not covered — type yours.

What the €200 means

A €1,000 SaaS invoice to a consumer in France, from a German seller over the €10,000 threshold, carries French VAT at 20%: €200.00 VAT, €1,200.00 total, declared through the One-Stop Shop. Tick "Business" without a VIES-confirmed VAT ID and invoice it as reverse charge, and those €200.00 are left off the invoice. The seller still owes the VAT (Art. 193). The Q3 2026 OSS return is due 31 October 2026 (Art. 369f).

Free: the VAT status badge set

Reverse chargeOSS — FR VAT 20%Domestic VAT 19%Outside EU VAT

4 badge variants as a Figma plugin, SVGs and a .sketch file. Label every invoice in your dashboard with its VAT treatment. This page decides which one.

In the full kit: 8 components, 27 variants

Delivered as a Figma plugin (TypeScript source), 27 SVG files and one .sketch file. How to open it: 1) in Figma, drag the .sketch file onto the file browser; 2) copy an SVG and paste it into a frame, and it comes in as a vector. Menu names differ by Figma version and UI language. Some component structure may be simplified by the .sketch import. Sketch users open the same file.

Why not a free kit: free dashboard kits ship a generic "Paid/Overdue" badge and a blank tax line. They have no state for a VAT ID VIES did not confirm, the €10,000 OSS switch or the Art. 226 wording. Yardstick: rival dashboard UI kits cost up to $168. This page is a design aid, not tax advice.

Get the complete version $168

This page is the working piece. The full pack has everything below.

8 billing components, 27 variants with the invoice wording EU VAT law asks for. A €1,000 sale to a French consumer invoiced as reverse charge leaves €200 VAT off, and you owe it (Art. 193).

EU VAT Directive 2006/112/EC: Art. 196 puts B2B service VAT on the customer (reverse charge), Art. 226(11a) requires the words "Reverse charge" on that invoice, Art. 58 taxes consumer e-services where the consumer lives, Art. 59c

Buy the full version — $168
Want the full version?
Enter your email and we send the download link.
ENDEJAESPT

Find a tool

· ReadyStack

Worked example

Real numbers from this tool, line by line.

Dashboard UI Kit for EU SaaS Billing — VAT ID, Reverse Charge & OSS States (Figma + Sketch)

A French consumer buys a €1,000 SaaS plan from a German company. Which VAT goes on the invoice? If the seller's EU cross-border sales to consumers passed €10,000 this year or last year, the answer is French VAT at 20%: €200.00 VAT and a €1,200.00 total, declared through the One-Stop Shop. If the checkout ticked "Business" and the invoice went out as reverse charge, that €200.00 never appears on the invoice. The seller still owes it: under Article 193 of the VAT Directive (2006/112/EC), VAT is payable by the business making the supply.

That is the billing state a dashboard UI kit usually leaves blank. Free dashboard kits give you a "Paid" and an "Overdue" badge and a tax line with no rule behind it. An EU SaaS billing screen needs more states than that, and each one is set by a specific article:

The timing matters as much as the rate. OSS returns are due by the end of the month after each quarter (Art. 369f), so the return for Q3 2026 is due 31 October 2026. An invoice mislabelled in September shows up in that return.

This dashboard UI kit puts those states in Figma as components you place, not prose you rewrite. It has 8 components and 27 variants: a VAT status badge (4), a VAT ID field (4: empty, confirmed in VIES, VIES did not confirm, non-EU customer), a VAT alert (4), an invoice total card (4, each with the computed VAT line above), a business/consumer toggle (2), billing tabs (3), invoice buttons (4) and article tooltips (2). The kit ships as a Figma plugin in TypeScript source, 27 SVG files and one .sketch file. To open it, drag the .sketch file into Figma, or copy an SVG and paste it into a frame as a vector. Some component structure may be simplified by the .sketch import. Sketch users open the same file.

The free part is complete for one job. The four VAT status badges come as plugin, SVG and .sketch. The web page takes your seller country, customer country, VAT ID status, the €10,000 threshold and a net amount, and returns the treatment, rate, VAT, total and invoice wording. Change any one input and the answer changes. The VAT rate field is editable, so a rate change or a reduced rate does not leave you with a wrong number.

The paid kit is the rest of the screen that the badge now needs around it: the field that captures the VAT ID, the alerts that stop the wrong invoice, and the cards that print the right total. It is a design aid, not tax advice. Your accountant still signs off on your setup. Try your own invoice case on the free page first.

15 seconds — what it actually does

Questions people ask

What does this dashboard UI kit contain?

Eight Figma components for an EU billing dashboard — VAT status badge, VAT-ID field, VAT alert, invoice total card, customer-type toggle, billing tabs, invoice buttons and article tooltips — in 27 variants. Each carries the wording EU VAT law expects, such as "Reverse charge" under Art. 226(11a). It ships as a Figma plugin, 27 SVG files and one .sketch file.

Who is this kit for?

SaaS founders and product designers based in an EU member state who bill both businesses and consumers in other EU countries. If your checkout must decide between reverse charge, One-Stop Shop VAT in the customer's country, domestic VAT or no EU VAT for customers outside the EU, the kit has a ready state for each case.

Why not use a free dashboard kit?

Free dashboard kits give you a generic Paid or Overdue badge and an empty tax line. They have no state for a VAT ID that VIES did not confirm, no alert for passing the €10,000 OSS threshold, and no invoice card that prints the reverse-charge wording. Designing those states yourself means reading the Directive first.

What can I use for free?

The four VAT status badges (Reverse charge, OSS customer-country VAT, Domestic VAT, Outside EU VAT) as plugin, SVG and .sketch, plus the web page. Enter seller country, customer country, VAT-ID status, the €10,000 threshold and a net amount, and it shows the treatment, rate, VAT, total and invoice wording for that invoice.

How does the price compare?

The full kit is $168 once, not a subscription. Rival dashboard UI kits on this shelf cost up to $168 and carry no VAT states. The cost of a wrong state is the VAT itself: a €1,000 sale to a French consumer invoiced as reverse charge leaves €200 off the invoice, and the seller still owes it.

Ask about this tool

One question, answered by the person who built it. Your email only if you want the answer sent.

Same job, next tool

Free in the browser. The full version is a one-time licence.

Web UI Kit for SaaS Dashboards — 8 Components, 32 Variant States (Figma plugin$168Ecommerce Icon Pack UI Kit — Cart, Checkout & Order-Status Components in 32 St$168Healthcare Icon Pack? Start With the Screen — Patient-Safety UI Kit for Figma $168Reverse Charge VAT Invoice Checker 2026$60Dashboard UI Kit — WCAG 2.1 AA Contrast Checked, Figma$168Mobile App UI Kit — Accessible Components for Figma (WCAG 2.2 AA, EAA)$168