Need advice about which tool to choose?Ask the StackShare community!

Flat UI

107
143
+ 1
4
Material Design Lite

689
393
+ 1
62
Add tool

Flat UI vs Material Design Lite: What are the differences?

Developers describe Flat UI as "Free Bootstrap Framework and Theme". Flat UI is a beautiful theme for Bootstrap. We have redesigned many of its components to look flat in every pixel. On the other hand, Material Design Lite is detailed as "Material Design Lite Components in HTML/CSS/JS". Material Design Lite (MDL) lets you add a Material Design look and feel to your static content websites. It doesn't rely on any JavaScript frameworks or libraries. Optimized for cross-device use, gracefully degrades in older browsers, and offers an experience that is accessible from the get-go.

Flat UI and Material Design Lite can be categorized as "Front-End Frameworks" tools.

Some of the features offered by Flat UI are:

  • Bootstrap-based
  • Retina Ready Images and Icons
  • Custom form components

On the other hand, Material Design Lite provides the following key features:

  • Blog Template
  • Dashboard Template
  • Text Heavy Webpage Template

Flat UI and Material Design Lite are both open source tools. It seems that Material Design Lite with 31.3K GitHub stars and 5.32K forks on GitHub has more adoption than Flat UI with 14.5K GitHub stars and 2.46K GitHub forks.

According to the StackShare community, Material Design Lite has a broader approval, being mentioned in 9 company stacks & 26 developers stacks; compared to Flat UI, which is listed in 4 company stacks and 3 developer stacks.

Get Advice from developers at your company using StackShare Enterprise. Sign up for StackShare Enterprise.
Learn More
Pros of Flat UI
Pros of Material Design Lite
  • 1
    Sass support
  • 1
    CSS class naming conventions are similar to Bootstrap
  • 1
    Good for mockups and minimal UI design
  • 1
    Basic Flat design
  • 23
    Material Design straight from the original creators
  • 11
    Based on bem philosophy
  • 9
    Nice animations
  • 7
    SCSS
  • 5
    Simple Material Design
  • 5
    Doesn't depend on JavaScript
  • 2
    Custom color palette generates CDN

Sign up to add or upvote prosMake informed product decisions

Cons of Flat UI
Cons of Material Design Lite
  • 1
    Not for creative and modern UI design
    Be the first to leave a con

    Sign up to add or upvote consMake informed product decisions

    What is Flat UI?

    Flat UI is a beautiful theme for Bootstrap. We have redesigned many of its components to look flat in every pixel.

    What is Material Design Lite?

    Material Design Lite (MDL) lets you add a Material Design look and feel to your static content websites. It doesn't rely on any JavaScript frameworks or libraries. Optimized for cross-device use, gracefully degrades in older browsers, and offers an experience that is accessible from the get-go.

    Need advice about which tool to choose?Ask the StackShare community!

    What companies use Flat UI?
    What companies use Material Design Lite?
    See which teams inside your own company are using Flat UI or Material Design Lite.
    Sign up for StackShare EnterpriseLearn More

    Sign up to get full access to all the companiesMake informed product decisions

    What tools integrate with Flat UI?
    What tools integrate with Material Design Lite?
      No integrations found
      What are some alternatives to Flat UI and Material Design Lite?
      Material Design
      Material Design is a unified system that combines theory, resources, and tools for crafting digital experiences.
      Material-UI
      Material UI is a library of React UI components that implements Google's Material Design.
      Bootstrap
      Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
      Material Design for Angular
      Material Design is a specification for a unified system of visual, motion, and interaction design that adapts across different devices. Our goal is to deliver a lean, lightweight set of AngularJS-native UI elements that implement the material design system for use in Angular SPAs.
      Animate.css
      It is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
      See all alternatives