Dialtone
This is the home for Dialtone, Dialpad's design system. It includes the resources needed to create consistent, predictable interfaces that conform to Dialpad’s design principles, language, styles, and best practices.
Install Dialtone
Install it via NPM:
npm install @dialpad/dialtone
Import dialtone:
- CSS/LESS:
@import "node_modules/@dialpad/dialtone/lib/dist/css/dialtone.min.css";- Javascript:
import '@dialpad/dialtone/lib/dist/css/dialtone.min.css';Add dialtone's theme class to the <body>
- Light mode
<body class="dialtone-theme-light">...</body>- Dark mode
<body class="dialtone-theme-dark">...</body>This will define the Dialtone CSS variables for your desired theme. It is required to do this for Dialtone to function.
Building Dialtone locally
To build Dialtone locally, visit our installation instructions.
Contributing
If you're interested in contributing to Dialtone, please read our contributing docs before submitting a pull request.
Requesting features / reporting bugs
Requesting a feature or reporting a bug? Please do so at the below links:
Please also feel free to contact us via the #dialtone Slack channel with any questions