Skip to content

dialtone-icons 4.31.0

Install from the command line:
Learn more about npm packages
$ npm install @dialpad/dialtone-icons@4.31.0
Install via package.json:
"@dialpad/dialtone-icons": "4.31.0"

About this version

Dialtone Icons

This is the home for Dialtone icons and illustrations. It includes the resources needed to implement icons and illustrations on your application that conform to Dialpad’s design principles and best practices.

Install Dialtone icons via NPM

To add Dialtone icons into your project, you can install it via NPM:

npm install --save @dialpad/dialtone-icons

Once installed, you can import icons and illustrations in a couple different ways:

In Vue.js

  • Individually (tree-shakeable):
// named import (preferred on vite)
import { DtIconAccessibility } from '@dialpad/dialtone-icons/vue2'; // Vue 2.6+
import { DtIconAccessibility } from '@dialpad/dialtone-icons/vue3'; // Vue 3+
import { DtIllustrationBlankSpace } from '@dialpad/dialtone-icons/vue2'; // Vue 2.6+
import { DtIllustrationBlankSpace } from '@dialpad/dialtone-icons/vue3'; // Vue 3+

// default import (preferred on webpack)
import DtIconAccessibility from '@dialpad/dialtone-icons/vue2/accessibility'; // Vue 2.6+
import DtIconAccessibility from '@dialpad/dialtone-icons/vue3/accessibility'; // Vue 3+
import DtIllustrationBlankSpace from '@dialpad/dialtone-icons/vue2/blank-space'; // Vue 2.6+
import DtIllustrationBlankSpace from '@dialpad/dialtone-icons/vue3/blank-space'; // Vue 3+
  • All the icon components:
import { icons } from '@dialpad/dialtone-icons/vue2'; // Vue 2.6+
import { icons } from '@dialpad/dialtone-icons/vue3'; // Vue 3+
  • All the illustration components:
import { illustrations } from '@dialpad/dialtone-icons/vue2'; // Vue 2.6+
import { illustrations } from '@dialpad/dialtone-icons/vue3'; // Vue 3+
  • Importing icon related data
import keywords from '@dialpad/dialtone-icons/keywords-icons.json';
import iconsList from '@dialpad/dialtone-icons/icons.js';
  • Importing illustration related data
import keywords from '@dialpad/dialtone-icons/keywords-illustrations.json';
import illustrationsList from '@dialpad/dialtone-icons/illustrations.js';

Committing

  1. Place the .svg files into the category folder inside these directory depending if it's an icon or an illustration:

    • icon: src/svg/icons
    • illustration: src/svg/illustrations
  2. Run nx run dialtone-icons:build

  3. Commit and push your changes.

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 Dialpad channel with any questions.

Details


Assets

  • dialtone-icons-4.31.0.tgz

Download activity

  • Total downloads 0
  • Last 30 days 0
  • Last week 0
  • Today 0