About Dialtone

Dialtone is Dialpad's Design System that unites product teams around a common visual language.


Components are reusable building blocks that support a specific interaction or UI need. These components can be reused across Dialpad products and projects ensuring UI consistency and cohesion while helping teams deliver high-quality features faster.

Dialtone provides two options to use the components: CSS and Vue.

Use Vue componentsopen in new window in the case your project supports Vue since these components are built conforming to WCAG AA Accessibility Guidelinesopen in new window and with usability and performance in mind.

CSS components

If Vue isn't supported in your application, you can use the CSS components in your project, but you'll be responsible for writing the correct markup, managing DOM elements and events, and making it accessible for all users.

See more about components usage.



Read about how to contribute to Dialtone.

Request a feature

If your design isn't supported by any existing component, or the component you want to use isn't flexible enough to use in your design, please request a feature by filling out this formopen in new window.

Report a bug

Please refer to CONTRIBUTING.mdopen in new window for reporting any issue.

Contact Us

Last Updated: