Macaw - Stop writing code, start drawing it

Product design is one of the most sought after fields nowadays. In order to design products a design must have a grasp of the whole creative process, from conception, UX, visuals, user studies and of course prototyping. There are several tools and prototyping frameworks, most of them requiring coding skills. Macaw was created to challenge that and provide a design tool that works like an image editor but also generates great code.

Macaw is changing the way the web is created with a revolutionary design tool that works like an image editor but also writes professional-grade HTML and CSS - something long considered impossible. By bridging the gap between design and development, Macaw is lowering the barrier of entry for budding web designers and dramatically accelerating the creation process for pros.

The superhot web design tool of the future - Jeffrey Zeldman


  • Responsive: Set breakpoints and optimize your site for all devices.
  • Interactive: Set variable names and add scripts for fast prototyping
  • Positioning: Utilize static, absolute and fixed positioning for dynamic layouts.
  • Components: Store elements in your library and reuse them on any page.

"I dunno what sorcery they're using to make the code, but it's amazing and beautiful." — Mike Finch


Macaw’s design environment is powered by a real-time layout engine called Stream, which allows elements to be manipulated in a manner similar to image editors like Adobe’s Photoshop. Behind the scenes, Stream calculates all of the properties necessary (floats, clears, margins, etc) to place the elements into a static document flow just as a seasoned developer would. The days of fighting layout logic are over.

The Team

Introduction Video

For more information visit

Brought to you by