Skip to content

intuit/devtools-ds

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Devtools DS Logo

Components and tools for building browser devtools extensions, built on DS-CLI and PostCSS Themed.


CircleCI All Contributors Version Downloads Auto Release code style: prettier

Ever wanted to build your own browser extension or devtools panel? This project can help! We've built out a set of utilities and React components that let you mirror the functionality of the Chrome/FireFox developer tools.

Each component:

  • Supports themes for multiple browsers
  • Is fully written in TypeScript
  • Aims to be keyboard accessible and screen-reader friendly
  • Uses minimal external dependencies

Read more in our Storybook documentation site.

🔨 Developer Set-up

Access source files and and make contributions using the following setup steps:

  1. Clone the repo

    git clone https://github.com/design-systems/devtools-ds.git
    cd devtools-ds
  2. Install dependencies

    yarn
  3. Build

    yarn build
  4. Start Storybook

    yarn storybook

🤝 Contributing

Whether it's improving documentation, adding a new component, or suggesting an issue that will help us improve, all contributions are welcome!

Top reasons to contribute:

  • 😍 Empower others to build high quality browser devtools experiences
  • 🎓 Learn design system development
  • Help maintainers prioritize impactful work

Here are some ideas for contributions:

  • New components
  • New themes (We'd love to see some Safari themes eventually)
  • Accessibility improvements
  • New browser extension templates
  • Support for frameworks like Vue, Angular, or Svelte

For more information about contributing, read our contributing guide and code of conduct.

Contributors

Thanks goes to these wonderful people (emoji key):


Tyler Krupicka

️️️️♿️ 🐛 💻 🎨 📖 💡 🚇 🚧 ⚠️ 🔧

Adam Dierkens

️️️️♿️ 💻 🎨 📖 💡 🚇 🚧 📦 ⚠️ 🔧

Shelby Cohen

️️️️♿️ 💻 🎨 📖 ⚠️

Kelly Harrop

🎨

Andrew Lisowski

📖 💡 💻

Adrian de la Rosa

💻 📖 💡

This project follows the all-contributors specification. Contributions of any kind welcome!