Styleguides + Design Languages

Chen Ye

Published in

HH Design

2 min readNov 19, 2015

Ones I like

Material design - Google design guidelines

We challenged ourselves to create a visual language for our users that synthesizes the classic principles of good…

www.google.com

IBM Design Language

Use the IBM Design Language to create beautifully crafted products and enlightening user experiences.

www.ibm.com

Designing for iOS

iOS embodies the following themes: Deference. The UI helps people understand and interact with the content, but never…

developer.apple.com

UIKit Catalog

Views are the building blocks for constructing your user interface. Rather than using one view to present your content…

developer.apple.com

Huge Inc Styleguide

A tool for easily creating and maintaining styleguides

hugeinc.github.io

Ubuntu Design

Ubuntu brand, app and web guidelines that help you create professional materials, software, sites, apps that build the…

design.ubuntu.com

Design Universal Windows Platform (UWP) app - Windows app development

Design basics, guidelines and templates for developers and designers to invent, plan, and build UWP apps.

dev.windows.com

Introducing: U.S. Web Design Standards

By Mollie Ruskin, United States Digital Service

medium.com

CFPB Design Manual

A set of design principles and standards for the Consumer Financial Protection Bureau.

cfpb.github.io

USPTO UI Design Library

We have a lot of web projects at the USPTO. These design guidelines and resources aim to create a unified experience…

uspto.github.io

Healthcare.gov Styleguide

The HealthCare.gov Styleguide provides an overview of styles, page layouts, assets, & editorial guidelines for…

styleguide.healthcare.gov

Lightning Design System

Utilize our detailed guidelines to confidently design excellent apps that fit right into the Salesforce ecosystem. With…

www.lightningdesignsystem.com

ID | VSCO

Notes from VSCO Design 🌭🍔🍕🍟🍗🍦

vsco.co

Medium Brand Development

Buffer Style Guide

Buffer makes it super easy to share any page you're reading. Keep your Buffer topped up and we automagically share them…

buffer.com

Lonely Planet Design Elements

Style Guide Documentation Performance Monitoring About Rizzo

rizzo.lonelyplanet.com

Mapbox styleguide | Mapbox

Welcome to Base - an internal guide & code repository for designing and coding at Mapbox. If you're new here, have a…

www.mapbox.com

MailChimp UX

Our grid system is composed of 8 flexible columns with a gutter between columns of 30px. We apply border-box so that…

ux.mailchimp.com

Mozilla Style Guide

Our mission - to promote openness, innovation and opportunity on the Internet - extends through everything we do. This…

www.mozilla.org

Homify Living Style Guide

Avoid cascading where possible Only use classes, no IDs or tag names For each module/component in app/assets…

www.homify.de

FontShop Styleguide

FontShop.com - Discover the world's best fonts

www.fontshop.com

Github Styleguide

GitHub is where people build software. More than 11 million people use GitHub to discover, fork, and contribute to over…

github.com

BBC - GEL (Global Experience Language)

BBC GEL BBC (Global Experience Language) guidelines

www.bbc.co.uk

Designing Hack@Brown

I wanted to touch on a few of our design decisions, and the role the design team played in organizing the hackathon.