Marvel Docs

Marvel, both as a product and a company, has grown a lot over the years. One challenge we are always faced with is learning how to refine the Marvel brand identity and apply it cohesively to each of our products.
These docs aim to act as a central location where we house a live inventory of UI components, brand guidelines, brand assets, code snippets, developer guidelines and more. Anyone working at Marvel, both product and engineering, is encouraged to stay familiar with these docs and help ensure that it is kept up-to-date.

Goals

Cohesive design language
Refine our visual language to be simpler, more fun and more communicative.
Platform agnostic system
Develop a single, unified system that is transferrable across all platforms and devices.
Expedite the design process
By abstracting our base styles layer, developers can churn out UIs with minimal design input.

FAQs

What is the Marvel styleguide?
Our styleguide is a live inventory of UI components, design patterns, brand assets and code guidelines which the whole Marvel team work from, keeping all of our products cohesive.
Do Marvel products use this styleguide?
This styleguide is built on the exact same codebase as each of our live products. This styleguide is the central hub — new updates are pushed here first, then trickle down to our live products.
Will this Marvel styleguide be open-sourced?
For the moment, we have not yet open-sourced, mainly because it is still heavily in flux. But yes, at some point in the near future we are planning to package it up and make it easily accessible to everyone.
Can I use this styleguide in my own work?
Sure, go ahead! We are planning to open-source our styleguide soon, so feel free to use it any way you wish when we do.