What is our Design System?

The Enterprise UX team provides various resources for installing the UX Style Guide into projects across various frameworks and development platforms.

These resources can help to eliminate code redundancy, create a streamlined development environment and a consistent user experience across all products.

All resources are backed by research and testing, community based and open for collaboration and contribution from all Home Depot product teams to build the best in class software. For additional information please contact uxops@homedepot.com.

Packages

To load a hosted package, copy and paste the HTML snippets for that library (shown below) in your web page. Replace VERSION with one of the versions listed for the package.

UX-Core-Styles

snippets:

<link rel="stylesheet" href="https://designsystem.homedepot.com/ux-core-styles/VERSION/ux-core-styles.min.css" crossorigin="anonymous">

versions:

2.3.0, 2.2.0, 2.0.1, 2.0.0, 1.12.2, 1.12.1, 1.12.0, 1.11.0, 1.10.0, 1.9.1, 1.9.0, 1.8.2

UX-Date Picker

snippets:

<script src="https://designsystem.homedepot.com/ux-date-picker/VERSION/ux-date-picker.min.js" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://designsystem.homedepot.com/ux-date-picker/VERSION/ux-date-picker.min.css" crossorigin="anonymous">

versions:

1.2.2, 1.2.0, 1.1.2, 1.1.1, 1.1.0, 1.0.3, 1.0.2, 1.0.1, 1.0.0

UX-Loader-Button

snippets:

<script src="https://designsystem.homedepot.com/ux-loader-button/VERSION/ux-loader-button.min.js" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://designsystem.homedepot.com/ux-loader-button/VERSION/ux-loader-button.min.css" crossorigin="anonymous">

versions:

1.0.4, 1.0.3, 1.0.2, 1.0.1, 1.0.0

UX-Progress-Indicator

snippets:

<link rel="stylesheet" href="https://designsystem.homedepot.com/ux-progress-indicator/VERSION/ux-progress-indicator.min.css" crossorigin="anonymous">

versions:

1.0.2, 1.0.1, 1.0.0

UX-Styleguide

snippets:

<script src="https://designsystem.homedepot.com/ux-styleguide/VERSION/ux-styleguide.min.js" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://designsystem.homedepot.com/ux-styleguide/VERSION/ux-styleguide.min.css" crossorigin="anonymous">

versions:

2.16.2, 2.16.1, 2.16.0, 2.15.1, 2.15.0, 2.14.1, 2.14.0, 2.13.0, 2.12.1, 2.12.0, 2.10.0, 2.9.1, 2.9.0, 2.8.0, 2.7.0, 2.6.0, 2.5.1, 2.5.0, 2.4.0, 2.3.1, 2.3.0, 2.2.0, 2.1.1, 2.0.0, 1.12.0, 1.11.3, 1.11.2, 1.11.1, 1.11.0, 1.10.0, 1.9.1, 1.9.0, 1.8.1, 1.8.0, 1.7.1, 1.7.0, 1.6.3, 1.6.2, 1.6.1, 1.6.0

Uxicon

snippets:

<link rel="stylesheet" href="https://designsystem.homedepot.com/uxicon/uxicon.min.css" crossorigin="anonymous">