Material Design Color Generator
What it is
Material Design Color Generator is a free, open-source web tool for making color palettes for Material Design and moving palettes into or out of supported frameworks and toolkits. Its targets include Android XML, AngularJS Material, AngularJS 2 Material, Ember Paper, Material Design Lite, Material UI, Material UI Next, Vue.js Material Design, and Flutter. MCG Reimport is also offered as an import and export option. You can choose among Traditional, Constantin, and Buckner generation algorithms. Traditional is the default and produces lower contrast; Constantin produces higher contrast; Buckner varies Constantin and focuses on A100–A700 hues. Accessibility checks are available, and Android XML and SCSS are listed as export formats. The project uses the MIT license and lists its price as Free. Its README recommends importing code generated by the tool because code from other sources may work unreliably. The interface does not support more than five palettes. Identifying primary and secondary palettes, rearranging palettes by dragging, and resetting individual colors are planned enhancements. The project directs users to GitHub Issues to report bugs or ask questions.
For and against
For
- Free to use and open source under the MIT license.
- Offers three palette generation algorithms.
- Supports imports and exports for multiple frameworks and toolkits.
- Provides Android XML and SCSS export formats.
- Includes accessibility checks.
Against
- The interface does not support more than five palettes.
- Code from other sources may import unreliably.
- Primary and secondary palette identification is a planned enhancement.
- Per-color reset buttons are a planned enhancement.
Who it suits
This tool suits designers and developers who need to generate Material Design palettes and export them for supported frameworks or toolkits. It also fits users who want a free, open-source option with accessibility checks.
Getting started
- Visit the Material Design Color Generator website.
- Generate a palette using Traditional, Constantin, or Buckner.
- Import code generated by the tool if you need to bring in a palette.
- Export to a supported target such as Android XML or SCSS.
- Report bugs or ask questions through GitHub Issues.
Limits to know
The interface supports no more than five palettes. Importing code from sources other than this tool may work unreliably.
The verdict
Choose Material Design Color Generator if you need a free web tool to create Material Design palettes and export them for a supported target. Look elsewhere if you need to manage more than five palettes or rely on importing code from unrelated sources.
Questions
Is Material Design Color Generator free?
Yes. It is listed as open-source software at no cost, with no paid plans stated.
Which platforms does it support?
It is a web tool. Supported targets include Android XML, AngularJS Material, AngularJS 2 Material, Ember Paper, Material Design Lite, Material UI, Material UI Next, Vue.js Material Design, and Flutter.
Which palette algorithms are available?
The algorithms are Traditional, Constantin, and Buckner. Traditional is the default and produces lower contrast; Constantin produces higher contrast; Buckner focuses on A100–A700 hues.
What formats can I export?
Android XML and SCSS are listed as export formats. The tool also supports importing and exporting palettes for listed frameworks and toolkits, including MCG Reimport.
Is the project open source?
Yes. The repository lists an MIT license.
How can I get help with the tool?
The project directs users to report bugs or ask questions through GitHub Issues.
Facts on the record
- Algorithm detail
- Buckner is described as a variation of Constantin focused on A100–A700 hues.github.com · read 4 Oct 2026
- Further palette controls
- Identifying primary and secondary palettes, drag-and-drop palette ordering, and per-color reset buttons are listed as planned enhancements.github.com · read 4 Oct 2026
- Generation algorithms
- The generator offers Traditional, Constantin, and Buckner algorithms; Traditional is the default and produces lower contrast, while Constantin produces higher contrast.github.com · read 4 Oct 2026
- Import limitation
- The README recommends importing code generated by this tool and says code from other sources may work unreliably.github.com · read 4 Oct 2026
- Integrations
- Supported targets include Android XML, AngularJS Material, AngularJS 2 Material, Ember Paper, Material Design Lite, Material UI, Material UI Next, Vue.js Material Design, and Flutter.github.com · read 4 Oct 2026
- License
- The repository lists an MIT license.github.com · read 4 Oct 2026
- Palette limit
- A planned enhancement calls out that the interface does not yet support more than five palettes.github.com · read 4 Oct 2026
- Purpose
- Generates color palettes for Material Design and supports importing and exporting palettes for frameworks and toolkits.github.com · read 4 Oct 2026
- Reimport
- MCG Reimport is also listed as a supported proprietary import/export option.github.com · read 4 Oct 2026
- Security
- The opened project page does not describe security certifications or compliance.github.com · read 4 Oct 2026
- Support
- The project directs users to report bugs or ask questions through GitHub Issues.github.com · read 4 Oct 2026