Skip to content
Adopt a unified design language across platforms, codebases, and teams
TypeScript Swift Kotlin JavaScript HTML CSS Other
Branch: master
Clone or download
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github chore(docs): fix a wrong link (#69) Feb 11, 2020
.vscode feat(extractors): add missing typograph properties in Sketch extractor ( Jan 14, 2020
examples fix(create): use path to build files in webpack conf instead of symli… Feb 13, 2020
scripts
services
src fix(extractors): quote invalid properties before generating diez code ( Feb 14, 2020
.diezrc chore: remove website (moved to diez/www.diez.org) (#16) Nov 25, 2019
.gitignore Documentation and coverage (#52) Nov 14, 2019
.npmrc
.travis.yml tweak: improve CI build times (#8) Dec 4, 2019
CHANGELOG.md v10.2.3 Feb 7, 2020
CODE_OF_CONDUCT.md Documentation and coverage (#52) Nov 14, 2019
CONTRIBUTING.md docs: itemizes supported prefix tags when creating pull requests (#54) Jan 8, 2020
LICENSE.md
NOTICE.md chore: remove trailing whitespace from NOTICE.md (#218) Nov 14, 2019
README.md tweak: update links to enterprise-grade Nov 14, 2019
codecov.yml refactor: add first-class support for `Font` prefabs (#122) Nov 14, 2019
lerna.json v10.2.3 Feb 7, 2020
package.json prerelease: 10.2.3 Feb 7, 2020
tsconfig.json refactor: place packages in directories corresponding with product bo… Nov 14, 2019
tslint.json Initial commit Nov 14, 2019
typedoc.json refactor: place packages in directories corresponding with product bo… Nov 14, 2019
yarn.lock chore: update yarn.lock Jan 17, 2020

README.md

Diez · Build Status codecov

Diez is an open-source framework for creating design languages.

Diez allows you to maintain a centralized source of truth for your visual identity (a.k.a. your brand)—in a way that seamlessly integrates with any native iOS, Android, or Web codebase.

Update once, update everywhere—while embracing native platforms. Diez radically reduces the cost of delivering a consistent look & feel across your company’s apps & websites.

What's in the box?

  • Design Language Framework: Express platform-agnostic design languages in TypeScript, including helpers ("prefabs") for common building-blocks like colors, typography, images, shadows, and more.

  • Cross-platform Compiler: Build your design language into pure-native SDKs for iOS, Android, and the Web. Supports Swift, Objective-C, Kotlin, Java, TypeScript, JavaScript, and CSS/SASS.

    These compiled packages are statically typed, self-documenting, and ready for any new or existing codebase. Distribution & versioning are supported with Carthage & Cocoapods on iOS, Gradle on Android, and npm+yarn on web.

  • Design file Extractors: Extract image assets and strongly typed style definitions (colors, typography, and more) from Sketch, Figma, and InVision DSM. The output of Extractors is Diez-ready TypeScript, ready to compile to native code.

    Treat design files as versionable code artifacts and automate your design-to-development workflow.

  • Diez CLI: Generate, configure, and manage Diez projects.

You can find all of the packages in the repo here. Feel free to take a look around!

Getting Started

Please refer to diez.org/getting-started for installation instructions and a thorough set of getting started guides.

Target Platform Support

Diez can be extended to support any language, platform, or development environment. The native bindings included with Diez support the following targets:

iOS

The minimum deployment target for a generated iOS SDK is iOS 11.

Android

The SDK generated by the provided Android implementation has been tested against Android Q (10).

Web

In the provided web target implementation, we support CSS, Sass, and vanilla JS. Browser and build tooling support is very broad, and Diez web SDKs work in any modern web browser.

Questions, guides, FAQ

Join our Slack Community and Spectrum Community to open a direct line to our team. Feel free also to file a GitHub issue if you encounter any bugs or problems.

Also check out the website: diez.org.

Universal commands

The following commands are available in all subpackages, as well as in the monorepo itself. Running these commands in the monorepo will run across all subpackages.

  • yarn compile - compile all TypeScript to JS.
  • yarn watch - compile, then watch for changes.
  • yarn lint - lint TypeScript sources.
  • yarn fix - lint and automatically fix any automatically fixable lint issues found.
  • yarn test - run unit/integration tests.
  • yarn health - run tests and lint code with machine-readable outputs for CI.

Licensing

Diez is published under a dual-license model in two editions: Community Edition and Enterprise Edition. This repository represents Community Edition and is licensed accordingly.

Learn more about Diez licensing here.

Diez Enterprise Edition

Diez Enterprise Edition includes the Diez DocsGen add-on — an additional compiler target that allows you to build any Diez project into up-to-the-moment design language docs. Customizable, searchable, self-hostable. Perfect for enterprise design systems.

Gif showcasing DocsGen add-on

Diez EE also comes with flexible commercial licensing if the Community Edition license doesn't meet your needs, plus availability for integration, training, and support from the Diez team.

Learn more about Diez EE.

You can’t perform that action at this time.