Skip to content

Getting Started


The library is not intended to be installed as a dependency inside a project. Instead, individual components are copied into your theme and adjusted as needed.

In order to provide access to the Hyvä UI only to Hyvä license holders, access to the components is through composer:

If you’ve got the Hyvä Theme Packagist key configured in your project, just run this composer command:

composer require --dev hyva-themes/hyva-ui

Or, for Hyvä Theme V1.1.X (using Tailwind CSS and AlpineJS version 2):

composer require --dev hyva-themes/hyva-ui:1.0.0

If you have a Hyvä-Themes license and gitlab access as a partner/contributor, you can find the UI Elements at


Each component has a dedicated file in its folder with component specific usage instructions.

For most components, using them only requires the template file to be copied into your Hyvä theme, possibly followed by some tailwind configuration adjustments.

Do not clone the repository into your Magento project, especially not into your theme!

This would have a number of negative side effects.

  • More tailwind classes would be generated than needed, bloating your themes styles.css file.
  • In the future, we might remove, rename or change components in a backward incompatible manner, breaking your site.

The idea is really to copy the templates into your project and adjust them as needed for a given Magento store.

For more details, watch the Demo Videos.