Skip to main content
  • Matthias Ott
    User Experience Designer
  • About
  • Workshops
  • Notes
  • Articles
  • Links

Links

  • #a11y (8)
  • #accessibility (3)
  • #agile (1)
  • #algorithms (1)
  • #animation (3)
  • #apps (2)
  • #architecture (1)
  • #articles (1)
  • #automation (1)
  • #basics (2)
  • #books (3)
  • #branding (1)
  • #browsers (1)
  • #build pipeline (1)
  • #business (2)
  • #chrome (1)
  • #code (6)
  • #color (2)
  • #component libraries (1)
  • #components (3)
  • #compression (1)
  • #craft (1)
  • #css (14)
  • #css grid (1)
  • #culture (3)
  • #dependencies (1)
  • #design (27)
  • #design thinking (2)
  • #design-systems (6)
  • #development (6)
  • #devices (1)
  • #education (1)
  • #engine (1)
  • #enhancement (1)
  • #flexbox (2)
  • #font (1)
  • #fonts (1)
  • #foundations (1)
  • #freelancing (1)
  • #game (1)
  • #git (1)
  • #github (1)
  • #graphics (1)
  • #grid (2)
  • #grunt (1)
  • #handbooks (1)
  • #head (1)
  • #history (1)
  • #html (4)
  • #hypertext (1)
  • #ia (1)
  • #icons (1)
  • #image (4)
  • #image optimization (1)
  • #inclusive design (1)
  • #indieweb (2)
  • #information (2)
  • #iterative (1)
  • #javascript (4)
  • #js (1)
  • #language (1)
  • #layout (6)
  • #leadership (2)
  • #learning (3)
  • #machine learning (1)
  • #media (1)
  • #media- (1)
  • #meta (1)
  • #modular (1)
  • #navigation (1)
  • #optimization (1)
  • #organizations (1)
  • #pattern libraries (6)
  • #performance (6)
  • #perspective (1)
  • #physics (1)
  • #picture (1)
  • #polyfills (1)
  • #postels-law (1)
  • #principles (4)
  • #process (6)
  • #progressive (2)
  • #progressive-enhancement (1)
  • #prototyping (4)
  • #public speaking (1)
  • #pwa (1)
  • #reference (2)
  • #resource (3)
  • #responsibility (1)
  • #responsive (4)
  • #robots (1)
  • #rss (1)
  • #rwd (4)
  • #sass (1)
  • #science (1)
  • #semantics (1)
  • #sketching (1)
  • #social (1)
  • #society (1)
  • #space (1)

Entries tagged with #styleguides.

↳ Show all entries

A11Y Style Guide, by @cariefisher

http://a11y-style-guide.com/style-guide/

The A11Y style guide comes with pre-populated accessible components that include helpful links to related tools, articles, and WCAG guidelines to make your site more inclusive.

  • #a11y
  • #styleguides
  • #style guides

Styleguides.io – Website Style Guide Resources

http://styleguides.io/

A huge treasure trove of real life pattern libraries, code standards documents, and content style guides, articles, books, podcasts, talks, and tools.

  • #pattern libraries
  • #styleguides
  • #resource
  • #articles
  • #talks

The Sky Digital Toolkit

https://www.sky.com/toolkit

The Sky Digital Toolkit is the central resource for designers and developers to understand how to design and build digital products for Sky.

  • #styleguides
  • #pattern libraries
  • #design-systems

Fractal – build and document web component libraries & styleguides

http://fractal.build/

Fractal by @allmarkedup, frontend dev @clearleft, lets you build and document web component libraries and styleguides, and then integrate them into your projects. It is flexible, data-driven, and can be seamlessly integrated into your site.

  • #styleguides
  • #design
  • #design-systems
  • #components
  • #component libraries
  • #development
  • #pattern libraries

Making And Maintaining Atomic Design Systems With Pattern Lab 2 By

https://www.smashingmagazine.com/2016/07/building-maintaining-atomic-design-systems-pattern-lab/

Pattern Lab 2 is an open-source suite of tools to help you and your team create and maintain thoughtful UI design systems. At its core, it’s a static site generator that stitches together patterns and allows you to design with dynamic data.

  • #styleguides
  • #design
  • #design-systems
  • #ui
  • #pattern libraries
  • #tools
  • #static generators

Astrum – A lightweight pattern library for any web project

http://astrum.nodividestudio.com/

Astrum is a lightweight pattern library designed to be included with any web project. It's non-opinionated and doesn't expect you to write your markup or code in any particular way.

  • #design
  • #pattern libraries
  • #modular
  • #styleguides
  • #branding

Creating A Living Style Guide: A Case Study

https://www.smashingmagazine.com/2016/05/creating-a-living-style-guide-case-study/

One of the most elaborate case studies on living style guides I've read so far. By @StevenKLambert

  • #design
  • #styleguides
  • #development
  • #process
  • #design-systems

Style Guide Resources

http://styleguides.io/

This site lists lots of useful resources to help you learn about and create your own Front-End Style Guides and Pattern Libraries.Contributions by @maban, @bradfrost and many, many more.

  • #design
  • #styleguides

Sass Guidelines

http://sass-guidelin.es

An opinionated styleguide for writing sane, maintainable and scalable Sass.

  • #code
  • #css
  • #sass
  • #styleguides
  • About
  • Workshops
  • Notes
  • Articles
  • Links
Subscribe

You can subscribe to the RSS feeds for all posts or to individual feeds for articles, notes, and links.

Design and code © 2007–2023 Matthias Ott  •  Made with HTML, CSS, enhanced with JavaScript, powered by Craft CMS. .
Webmention endpoint   Privacy Policy   Site Notice / Impressum