Icons

Below is a reference to the icons available within the icon font included in the design system CSS. You can also download a zip file that contains an SVG file of each icon and/or the TTF icon font file. Please refer to the Dell Technologies brand website, https://brand.delltechnologies.com/icon/, for further information and requirements for iconography.

Download icon collection SVG zip file

Getting started with icons in code

SVGs

External SVG

Not yet supported. Will likely require JavaScript.

Embedded SVG

Embed (copy/paste) the SVG definitions in your page immediately after the <body> tag. You can see them by viewing the source here: https://uicore.dellcdn.com/0.2.1/icons/dds-icons-defs.svg

Basic Use

To use an SVG in your page include the unique class name and href (see below for a list of icons with class names):

<svg class="dti dds__d-display"><use xlink:href="#dds__d-display"></use></svg>

Loading Icon

See the Progress Indicators page for information about the Loading Indicator.

Icon Font

Standard

To embed your selected fonts into a webpage, copy this code into the <head> of your HTML document.

<link rel="stylesheet" href="https://uicore.dellcdn.com/0.2.1/css/dds-fonts.css">

@import

In the head of your page or in your CSS file, you can use the at-rule @import to load the icon font.

<style>

@import url('https://uicore.dellcdn.com/0.2.1/css/dds-fonts.css');

</style>