Multiple Configurable Grid Systems

Multiple Configurable Grid Systems

Layout Maker comes with a growing number of integrated grid systems, including the Bootstrap grid. Column counts and gutter widths can be customized for each system.

Drag-n-Drop Content Blocks

Drag-n-Drop Content Blocks

Design from the content out and tailor layouts around unique content and business needs. Add anything from a paragraph to an input element with just a drop.

FLUID, CONFIGURABLE, PX AND EM BASED GRIDS

MOBILE FIRST OR DESKTOP DOWN WORKFLOW

SUBGRIDS & CONTAINER NESTING

BOOTSTRAP GRID SUPPORT

Clean CSS + Semantic HTML

Clean CSS — Semantic HTML

No superfluous machine-generated code here. Specify your own classes & IDs, assign semantic tags, and more. Layout Maker keeps everything crisp and clean for easy hand-tweaking.

Custom Layout Designs

Custom Layout Designs

Add rows and content containers with a simple click. Toggle column spans, stretch rows, or constrain their widths. You can even use subgrids and container nesting for ultimate layout control — kabam!

 

Want to give it a shot? Try building a responsive layout in nine simple steps!

CUSTOM BREAKPOINTS

BUILT-IN VIEWPORT SLIDER

COMPREHENSIVE ELEMENT LIBRARY

CONFIGURABLE ELEMENT PROPERTIES

Configurable Element Properties

Configurable Element Properties

Control paddings, margins, floats, font styles, links and everything else that makes your unique content look its best.

Custom, Content-Driven Breakpoints

Custom, Content-Driven Breakpoints

Use the built-in viewport slider to view the design at every possible width. Add breakpoints to change column widths, define responsive actions, or tweak margins and sizes to guarantee that the layout is optimally usable on any device.

YOUR OWN CLASSES AND IDs

SEMANTIC HTML (SWAP CONTAINER TAGS)

CLEAN, SENSIBLE CSS

PROJECT MANAGEMENT

Browser-Based Prototyping

Browser-Based Prototyping

Wireframing and previewing in an actual browser makes your designs interactive and resizable. No more huge pile of static images to illustrate what a design might look like on different devices. Sweet!

Selector Color Codes

Selector Color Codes

Quickly identify the styles associated with, and applied by, each selector.

And we didn’t stop there

Multiple Pages
Push and Pull Classes
Display Properties
Choose your grid

Layout Maker also has mobile-first and desktop-down workflows, multi-page layouts, configurable export options, automatic em conversions, Google Web Fonts integration, advanced grid configurations, and we’re just getting started…