This is a beta release of documentation for Magento 2.4, published for previewing soon-to-be-released functionality. Content in this version is subject to change. Links to the v2.4 code base may not properly resolve until the code is officially released.

Using jQuery UI styles

Edit on GitHub
Log an Issue

What’s in this topic

This topic provides an overview of how jQuery UI styles are used in Magento out of the box, and how you can use them in a custom theme.

jQuery UI styles used on the storefront

In Magento out of the box certain storefront elements are implemented using jQuery UI widgets (like navigation menu, mini shopping cart and so on), with the default jQuery classes assigned. But Magento does not contain jQuery UI styles in the code base. Styles for the certain default jQuery UI classes are defined in Magento by default (in the default Magento storefront and Admin themes). For other jQuery UI classes styles are not defined.

We do not recommend downloading the jQuery UI styles as is, because they will override the default Magento themes definitions and break the default Magento design.

To use the jQuery styles, you need to define those which you need in your custom stylesheets in the <your_custom_theme>/web/css directory.

© 2020 Magento. All rights reserved.