Styleguide

  •        8

Devbridge Styleguide helps you create, share, and automate a living visual style library of your brand. Share your digital brand standards, improve team collaboration, and implement an independent easily-extendable modular structure. Note, do not download files directly from git repository, unless you know what you are doing.

https://www.devbridge.com/

Dependencies:

async : 1.2.1
body-parser : 1.12.4
colors : 1.1.2
commander : 2.8.1
express : 4.12.4
format-json : 1.0.3
jsonfile : 2.0.0
lodash : 4.0.0
mkdirp : 0.5.1
q : 1.4.1
request : 2.68.0
tcp-port-used : 0.1.2

Tags
Implementation
License
Platform

   




Related Projects

sc5-styleguide - Styleguide generator is a handy little tool that helps you generate good looking styleguides from stylesheets using KSS notation

  •    Javascript

Style guide generator is a handy little tool that helps you generate good looking style guides from style sheets using KSS notation. It can be used as a command line utility, gulp task or Grunt task (needs grunt-gulp) with minimal effort. You should familiarize yourself with both KSS and node-kss to get yourself started.

grunt-styleguide - Universal CSS styleguide generator for grunt

  •    HTML

If you are looking for a replacement and are using kss or styledocco see below. Universal CSS styleguide generator for grunt. Easily integrate Styledocco or KSS styleguide generation into your development workflow.

react-styleguide-generator - Easily generate a good-looking styleguide by adding some documentation to your React project

  •    Javascript

Easily generate a good-looking styleguide by adding some documentation to your React project. Demo using the React-Bootstrap.

ux-pattern-library - The (working) Visual, UI, and Front End Styleguide for edX.

  •    CSS

The (working) UI library and Front End Styleguide for edX/Open edX applications and sites. The code in this repository is licensed the Apache 2.0 license unless otherwise noted. Please see the LICENSE file for details.

styleguide-generators - An overview of automatic living styleguide generators

  •    

Pattern Libraries (or Style Guides) are a helpful tool in developing websites. Read more about Creating Style Guides at this A List Apart article. Maintaining a static Pattern Library (in HTML/CSS) is hard work and errorprone. There are, however, various tools that help us generate a dynamic Pattern Library or 'Living Style Guide'.


styledown - Markdown-based styleguide generator

  •    Javascript

Styledown is made to work in most web development setups. It doesn't favor any framework or language or any preprocessor. Here's a generic guide on getting started with Styledown on any project. We're gonna assume that you're using Sass and that your project bundles all CSS files into one file.

css-styleguide - :book: Opinionated CSS styleguide for scalable applications

  •    

This guide was heavily inspired by experiments, awesome people like @fat and @necolas and awesome projects made by Google, Airbnb and Medium. The following are some terms used throughout this styleguide.

generator-style-prototype - Yeoman Generator for Style Prototypes

  •    Javascript

Style Prototypes are a Pattern Library tool for designing in browser. Style prototyping is a technique used to create a typical instance of a design from which a final site can be assembled. Style Prototypes are a unique tool because, not only are they responsive by default (meaning your client will be able to sign off on styles they've been able to see natively on all browsers and devices), they encourage Style and Color Guide driven Style Tile and Component Guide generation. This means that after you've built out your Style Tile, you'll be on your way to having finished your Style Guide, which you need to for Style Guide Driven Design (and coincidentally takes lots of design decisions off of the shoulders of Front End Developers). You'll also never need to have someone guess at what colors they can use with a fully built out Color Guide with both hex and Sass values.

vue-styleguidist - Created from react styleguidist for Vue Components with a living style guide

  •    Javascript

Project was started when not finding a tool that generates documentation of components with hot reloading, read documentation and have a playground. Created from React Styleguidist, implement additional support to read and compile .vue files. Only supports 2.x. Vue Styleguidist is a style guide generator for Vue components. It lists component and shows live, editable usage examples based on Markdown files. You can use it to generate a static HTML page to share and publish or as a workbench for developing new components using hot reloaded dev server.

angularjs-styleguide - AngularJS styleguide for teams

  •    

Want an example structure as reference? Check out my component based architecture 1.5 app.This architecture and styleguide has been rewritten from the ground up for ES2015, the changes in AngularJS 1.5+ for future-upgrading your application to Angular. This guide includes new best practices for one-way dataflow, event delegation, component architecture and component routing.

go-styleguide - Opinionated Styleguide for the Go language

  •    

This serves as a supplement to Effective Go, based on years of experience and inspiration/ideas from conference talks.Using the approach above can lead to unclear error messages because of missing context.

proteus - [no longer maintained]

  •    Ruby

Note: Proteus is no longer being actively maintained. Proteus is a collection of useful starter kits to help you prototype faster. They follow the thoughtbot styleguide and includes our favorite front-end development tools.

astrum - A lightweight pattern library designed to be included with any web project.

  •    Javascript

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.

18f.gsa.gov - This repository contains 18F's website.

  •    CSS

This repo houses the 18F website. We use the Draft U.S. Web Design System as a front end framework. The site is built and served through the Federalist platform. 18f.gsa.gov extends the U.S. Web Design System and 18F Brand guidelines to create a style that is professional, unique, and informative. The style guide, located at 18f.gsa.gov/styleguide/ documents the patterns and components used to create this theme.

sass-guidelines - Guidelines for writing sane, maintainable and scalable Sass.

  •    HTML

An opinionated styleguide for writing sane, maintainable and scalable Sass. Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its terms.

style-dictionary - A build system for creating cross-platform styles.

  •    Javascript

Style once, use everywhere. A Style Dictionary is a system that allows you to define styles once, in a way for any platform or language to consume. A single place to create and edit your styles, and a single command exports these rules to all the places you need them - iOS, Android, CSS, JS, HTML, sketch files, style documentation, etc. It is available as a CLI through npm, but can also be used like any normal node module if you want to extend its functionality.

alva - Create living prototypes with code components.

  •    TypeScript

Alva is a radically new digital design tool built for cross-functional product teams. Alva works with your production frontend components, adding up-to-date, responsive, and interactive designs to your living styleguide.

storybook - UI component dev & test: React, Vue, Angular, React Native, Ember, Web Components & more!

  •    TypeScript

Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components. Storybook runs outside of your app. This allows you to develop UI components in isolation, which can improve component reuse, testability, and development speed. You can build quickly without having to worry about application-specific dependencies.

pho-devstack - Automated workflow for front-end developers in one tasty bowl of code.

  •    Javascript

Automated workflow for front-end developers in one tasty bowl of code. Phở Devstack uses Gulp as task runner, Yeoman for scaffolding new projects and Bower for installing client-side packages.