Skip to content
  • Adobe Commerce & Magento

    Adobe Commerce B2B

    Hyva icon

    Hyvä for Adobe Commerce and Magento

    Magento for B2B

    Portal - B2B Accelerator

    Adobe Commerce and Magento Support

    Ecommerce Consultancy

    Adobe Commerce and Magento Integrations

  • Ecommerce Marketing

    PPC for B2B

    PPC for Retail

    Paid Social

  • Work
  • About Us

    Partners

    Careers

  • News & Insights

    News & Insights

    Reports

    Resources

  • Contact
  • Adobe Commerce & Magento

    Adobe Commerce B2B

    Magento for B2B

    Hyva icon

    Hyvä for Adobe Commerce and Magento

    Portal - B2B Accelerator

    Adobe Commerce and Magento Support

    Adobe Commerce and Magento Integrations

    Ecommerce Consultancy

  • Ecommerce Marketing

    PPC for B2B

    PPC for Retail

    Paid Social

  • Work
  • About Us

    Partners

    Careers

  • News & Insights

    News & Insights

    Reports

    Resources

  • Contact

Discover Hyvä UI: The Game-Changing Component Library for Magento Retailers

Adobe Commerce | Hyvä | News & Insights
Picture of Adam Hindle

Adam Hindle

Managing Director

Date

07/09/2023

Hyvä have released their much anticipated Hyvä UI package, but what is it?

Hyvä UI is like having a collection of beautifully crafted building blocks that will easily fit into a Hyvä-themed website. From a development perspective, this hugely reduces the cost for merchants and time spent for development agencies, which enables faster project completion.

The best news of all, the Hyvä UI component library is free if you purchase Hyvä Theme for your Adobe Commerce / Magento Open Source store.

What’s Hyvä you ask? Read more here

What’s included in the Hyvä UI component library?

In short. A lot.

The Hyvä team has done the groundwork when it comes to “What’s missing from Luma theme”. Adobe has had years to add to Luma theme but has not changed a lot since originally launched.

Hyvä has added multiple components for menus, headers, footers, shortcut icons, content blocks, category landing page content blocks, footers, banners, CTAs, sliders, testimonials, USPs, product cards, cookie banners, modals, notifications and pop-ups.

In total, there are 36 components to use at the moment.

Hyvä has confirmed that the library will grow over time with updates regularly being added.

Our top 8 picks from the Hyvä UI library

1. Headers

There are three versions of a header for your Hyvä site:

  • Clean
  • Compact
  • Stacked
Clean
Compact
Stacked

2. Menu

Hyvä offers three versions of the header to work with. This is really strong as it allows merchants to quickly add changes to their website. The headers are:

  • Simple static links menu
  • 4 column mega menu
  • Vertical dropout 4 column menu

All three menus are very different and will accommodate most verticals.

My personal favourite is the Vertical dropout 4 column menu. Endless possibilities and great for user journey in large catalogues.

Simple static links
4 column mega menu
Vertical dropout 4 column

3. Footers

Again, Hyvä is offering 3 versions of a footer:

  • Clean
  • 4 column newsletter
  • Mega

This allows merchants a wide range of possibilities depending on how much content or information they want to share with customers. The mobile versions look incredible.

Clean
4 column newsletter
Mega

4. Product Listing Page (PLP)

This is a string addition to the UI options as the offerings are quite costly and complicated to apply to a standard Lume theme store. Having the option of size and colour swatches as well add-to-cart functionality is what makes this stand out.

The image below shows all device types.

5. Product Category Page (PCP)

Top-level category pages are essential for large catalogues and do work with small to medium when it visuals. Consumers generally shop in three ways:

  • Menu browsing
  • Search browsing
  • Landing Page browsing

Having a clear path using category pages makes it easy for the customer to visually see things in front of them when Landing Page browsing. The pages can also help from an accessibility point of view as well.

Hyvä has created two versions: Grid images and Grid patterns.

Grid images
Grid Patterns

6. Generic Content

Having clean, easy to use and readable content blocks makes life simple for consumers. Hyvä have created two versions, Text and Visual, which can easily be developed for quick changes and multiple options.

Text
Visual

7. Attention grabbers

From Cookie banners to Notifications, Hyvä UI offers eight attention grabbers for your store. This will once again save time and money in a development project by allowing the merchant to pick and choose the correct ones for their needs.

The Newsletter title options and Modal options are particularly strong.

Below are images are of the Modal components and the Cookie components. The image below shows all device types.

Modal
Cookie banners

8. CTA

Call-to-action elements are an important piece of any ecommerce platform. From homepage content blocks to offers within your megamenu, these are the signposts for pointing consumers to the correct place.

Hyvä have created three different CTA components:

  • Image
  • Text only
  • Split
Image
Text only
Split

Find out more

Want to discover the components that didn’t make our list? Click here to discover the full Hyvä UI component library (Sept 2023).

Willem Wigman, founder and creater of Hyvä, demonstrates all available components in the below video: 


Partner with Fluid Commerce

Fluid Commerce is a Silver Adobe Solution Partner and an official Hyvä partner. We develop and support superior Adobe Commerce & Magento Open Source websites.

Based in the North West of England, we are ecommerce agnostic, working with a host of B2B, B2C and DTC merchants across sectors including Home & Garden, Jewellery & Accessories, Health & Beauty, Technology, Fashion & Apparel.

To find out what Fluid and Hyvä can do for your business, get in touch here and our team be in touch asap.

Further Reading

  • Hyvä Theme Checkout Has Arrived
  • Why You Should Move to Hyvä Theme for Magento 2
How PPC campaigns can deliver growth for companies with thousands of different products
In this article, our technical director Matt Edwards talks about how the landscape is changing for the B2B ecommerce sector....
Read

AI could transform B2B ecommerce development but partners remain key

Read

What is Hyvä Commerce? A short but powerful history

Read
See all posts

Want an experienced Adobe partner by your side?

Book a free discovery call

Discover how Fluid Commerce can give your business the advantage
Share your digital objectives and pain points
Learn more about our approach and expertise
Discuss timeframes and budgets

Manchester HQ
Colony Jactin House, 24 Hood St, Manchester, M4 6WX

London
White Collar Factory, 1 Old Street Yard, London, EC1Y 8AF

0161 762 4920
[email protected]

Services
  • Adobe Commerce for B2B
  • Magento for B2B
  • Hyvä
  • Adobe Commerce and Magento Support
  • PPC for B2B Ecommerce
  • PPC for Retail Ecommerce
  • Paid Social for Ecommerce
Recent Work

Pearson Hydraulics

Salon Business Solutions

Rayware

Gecko Jewellery

Fletcher Stewart

Company
  • Home
  • About Us
  • News & Insights
  • Contact

© Fluid Commerce Limited | Registered in England No. 07026218 | Terms | Data | Privacy Policy

Facebook Instagram Twitter Linkedin
Go to mobile version