Canvas Apps: Pixel-Perfect Apps from Scratch
Canvas apps let you design every pixel of your app — drag, drop, and connect to data. Learn what canvas apps are, when to use them, and how Priya built a campaign tracker in a day.
What are canvas apps?
Think of a canvas app like a blank whiteboard.
You start with an empty screen and drag things onto it — buttons, text boxes, images, lists. You decide exactly where everything goes and how it looks.
Then you connect those pieces to your data — a SharePoint list, an Excel file, a database. The app reads and writes data for you.
No coding degree required. If you can build a PowerPoint slide, you can build a canvas app.
Meet Priya: the campaign tracker
Priya Sharma is a marketing manager at Spark & Co, a creative agency with 45 staff. Every quarter, her team runs 10-15 marketing campaigns. Until now, they tracked everything in a shared spreadsheet — and it was chaos.
Campaigns got missed. Status updates were out of date. Nobody knew which assets were approved.
Priya built a canvas app connected to a SharePoint list in one afternoon. Here is what it does:
- Home screen shows all active campaigns in a scrollable gallery
- Detail screen lets her tap any campaign to see status, budget, and assets
- New campaign form lets anyone on the team submit a campaign request
- Dashboard screen shows charts of campaign performance
She designed it to match the Spark & Co brand colours, and it runs on both phones and desktops. No developer needed.
Canvas app capabilities
| Capability | What it means |
|---|---|
| Pixel-perfect design | You control every element’s position, size, colour, and font |
| Multi-device | Apps run on iOS, Android, Windows, and web browsers |
| Responsive layouts | Containers let apps adapt to different screen sizes |
| Power Fx formulas | Excel-like formulas for logic, filtering, and calculations |
| 1,000+ connectors | Connect to SharePoint, SQL, Dataverse, Salesforce, and more |
| Offline capable | Apps can work without internet and sync when reconnected |
| Camera and GPS | Access device features like camera, barcode scanner, location |
| Copilot integration | Describe what you want and Copilot builds the first draft |
Power Fx in action
Power Fx is the formula language behind canvas apps. If you know Excel formulas, you already know the basics.
- Show items:
Filter(Campaigns, Status = "Active") - Count records:
CountRows(Filter(Campaigns, Status = "Complete")) - Navigate:
Navigate(DetailScreen, ScreenTransition.Fade) - Set a variable:
Set(selectedCampaign, ThisItem)
You write these formulas directly on controls. Select a button, set its OnSelect property to a formula, and it runs when tapped.
Canvas app anatomy
Every canvas app is made of three building blocks:
Screens — the pages of your app. Priya’s app has four screens: Home, Detail, New Campaign, and Dashboard. Users navigate between them with buttons or galleries.
Controls — the things on each screen. Buttons, text labels, galleries (scrollable lists), forms (for data entry), images, icons, charts, and more. You drag them from the insert panel and position them wherever you want.
Formulas — the behaviour. Every control has properties you set with Power Fx. A button’s OnSelect property tells the app what to do when tapped. A gallery’s Items property tells it what data to display.
When to use canvas apps
| Use case | Why canvas apps fit |
|---|---|
| Mobile field apps | GPS, camera, offline mode — perfect for on-the-go workers |
| Task-specific tools | Simple apps for one job: approvals, inspections, time tracking |
| Custom branding | When the app must match company colours and style |
| Non-Dataverse data | When data lives in SharePoint, Excel, SQL, or external systems |
| Rapid prototyping | Build a working prototype in hours, not weeks |
| Citizen developers | Business users with no coding experience can build these |
Canvas apps vs model-driven apps: a first look
| Feature | Canvas Apps | Model-Driven Apps |
|---|---|---|
| Design approach | You design every pixel | Layout auto-generated from data model |
| Starting point | Blank screen | Dataverse tables |
| Best for | Task-specific, mobile, custom UI | Complex data, business processes |
| Learning curve | Lower — feels like PowerPoint | Moderate — need to understand data modelling |
| Data source | Any connector (SharePoint, SQL, Excel, etc.) | Dataverse only |
Exam tip: how they test canvas apps
The PL-900 exam loves scenario questions. They describe a business need and ask which type of app to recommend.
Pick canvas app when you see: pixel-perfect design, mobile-first, camera or GPS, non-Dataverse data, citizen developer, simple task, custom branding.
Pick model-driven app when you see: complex relationships, business process flows, role-based views, Dataverse required.
🎬 Video walkthrough
Flashcards
Knowledge Check
Priya needs an app that matches her company's brand colours, works on phones, and connects to a SharePoint list. Which type of Power App should she build?
Which formula language powers the logic in canvas apps?
Which of the following are capabilities of canvas apps? (Select TWO)
Next up: Model-driven apps — where the data model drives the layout, and Tom builds a property management system.