M3E Canvas is a browser-based design tool for sketching Material 3 Expressive interfaces and turning them into prompts for AI coding tools. Users can drag buttons, cards, navigation bars, dialogs, fields, chips, images, and many other components onto a canvas. Screens can be linked together and tested as simple interactive flows before implementation. A Tidy function automatically aligns and groups nearby elements using Material-style spacing. Designs can be exported as PNG images or copied as prompts for tools such as Claude Code, Codex, Gemini CLI, and Cursor. Optional AI helpers can generate behavior notes and screen descriptions while keeping provider keys in the browser. Projects are stored locally and can also be shared through links.

Features

  • Material 3 Expressive drag-and-drop components
  • Multi-screen linking and tap-through prototypes
  • Automatic layout cleanup and grouping
  • AI coding prompt generation
  • Optional AI-written behavior and screen descriptions
  • PNG export, local storage, and shareable project links

Project Samples

Project Activity

See All Activity >

Categories

AI Coding

License

MIT License

Follow M3E Canvas

M3E Canvas Web Site

Other Useful Business Software
MongoDB Atlas runs apps anywhere Icon
MongoDB Atlas runs apps anywhere

Deploy in 115+ regions with the modern database for every enterprise.

MongoDB Atlas gives you the freedom to build and run modern applications anywhere—across AWS, Azure, and Google Cloud. With global availability in over 115 regions, Atlas lets you deploy close to your users, meet compliance needs, and scale with confidence across any geography.
Start Free
Rate This Project
Login To Rate This Project

User Reviews

Be the first to post a review of M3E Canvas!

Additional Project Details

Programming Language

TypeScript

Related Categories

TypeScript AI Coding Tool

Registered

19 hours ago