Design system

Showcase of reusable components and their variants. Use this page during development to verify visual consistency after changes.

eh-icon

Every icon name supported by {% render 'eh-icon', icon: '...' %}.

close
close-alt
play-circle
spinner
success-check
chat
download
email
hamburger
cart
cart-bag
phone
email-send
reddit
pinterest
facebook
instagram
youtube
free-shipping
warranty
customer-support
handmade
promo-percent
about-shipping
about-engineering
about-ease
about-support
feature-processor
feature-exchange
feature-weight
feature-motor
arrow-left
arrow-right
arrow-send
play-outline
linkedin
play-circle-outline
reason-money-back
reason-reviews
reason-warranty
reason-shipping
promo-usa-badge
discount
minus
plus
remove
success
promotion-sparks
promotion-gift

promo-banner-generic

USA flag (default, icon-left)

As rendered in hero-video for the usa-7 / memorial-day promos.

Memorial Day 2026
Memorial Day is almost here. Unlock Exclusive Savings: Get 7% Off Your Entire Order!
Gift (icon-right, sparks, overlap)

As rendered in hero-video for the promo-gift / black-friday promos.

Holiday Gift 2026
Give the gift of ergonomics. Limited-edition gift cards available now.

promo-signup

variant: bf

Black Friday email signup. Gold hero, single-row email + submit, consent checkbox.

variant: special-offers

Subscribe form with name + email + consent checkbox. Dark gradient hero with tag icon.

variant: usa

USA-styled signup: blue hero with flag, name + state + email, two-column layout on desktop.

promo-gift-card

Rendered in trust / hero-video when the active promo handle is promo-gift. Reads from the promotion metaobject — shown only if that metaobject exists.

No promo-gift metaobject exists in this store — nothing to preview.

promo-black-friday

Rendered in trust when the active promo handle is black-friday-cyber-monday-special. Reads from the promotion metaobject.

No black-friday-cyber-monday-special metaobject exists in this store — nothing to preview.

Buttons

.eh-button
.eh-button.eh-button--gold
.eh-button.disabled

Inputs

.promo-form-input (pill, borderless)

Used in promo-signup forms for name/state/email. Borderless — designed to sit on a coloured surface (--color-surface-alt). Styles are scoped to .s-promo-signup.

.promo-form-email (pill, taller)

Used inline with a submit button on the bf variant. Also borderless.

checkbox (.promo-checkbox-wrap)

Used for consent in promo-signup forms.

radio group

Native radio inputs with inline labels.

input with label (stacked)

Label above input.

textarea

Multi-line text input.

select

Native dropdown.

disabled + error states
.ds-input-plain (generic)

Not a shared class — shown as a fallback example of a rectangular input.

tabs-wrap

Tab strip defined in all.less. The .active tab gets a gold underline; tabs have no built-in click behaviour — callers wire it up themselves.

Description Features Stability Specs

four-reasons-to-buy

Four trust badges (money back, reviews, warranty, free shipping). Free-shipping label includes a minimum-spend note when product.price < 10000 — outside a product context that conditional is falsy.

180 dni gwarancji
zwrotu pieniędzy
4,9★
(ponad 900 opinii)
Gwarancja
5 lat
DARMOWA dostawa

warranty-section

Dark banner with a masked image on one side and a title + body on the other. Stacks image-on-top below 1020px.

5-letnia gwarancja

Zapewniamy 5-letnią gwarancję na bezbłędne działanie wszystkich komponentów.

SATYSFAKCJA GWARANTOWANA W 100%
W przypadku niezadowolenia z produktu, możesz odesłać go na nasz koszt w ciągu 180 dni od dostawy. Zapewniamy pełny zwrot pieniędzy.

card-product + product-grid

Primitives for collection pages, cart add-ons, and the homepage. Built on the shared .eh-card markup.

product-grid (4 cols)

Renders against collections.all.products, limited to 4.

  • Lampa z ruchomym stelażem

    Lampa z ruchomym stelażem

    Od €220,00 EUR
    Od €220,00 EUR
  • Półka na kable

    Półka na kable

    €150,00 EUR
    €150,00 EUR
  • Kółka z hamulcami

    Kółka z hamulcami

    Od €40,00 EUR
    Od €40,00 EUR
  • Klasyczna rama narożna

    Klasyczna rama narożna

    €490,00 EUR
    €490,00 EUR
product-grid (3 cols + view-all)

With view_all_url — renders the "View all" CTA under the grid.

  • Lampa z ruchomym stelażem

    Lampa z ruchomym stelażem

    Od €220,00 EUR
    Od €220,00 EUR
  • Półka na kable

    Półka na kable

    €150,00 EUR
    €150,00 EUR
  • Kółka z hamulcami

    Kółka z hamulcami

    Od €40,00 EUR
    Od €40,00 EUR
Wyświetl wszystkie
card-product (placeholder)

Rendered without card_product — the onboarding fallback.

Przykładowy tytuł produktu

€100,00 EUR
€100,00 EUR

price

Product price with locale-aware currency formatting. Composes bundle-price internally for bundle products.

Lampa z ruchomym stelażem
Od €220,00 EUR
Od €220,00 EUR
with show_badges

Inline sale / sold-out pills when the product matches the condition.

Od €220,00 EUR
Od €220,00 EUR
Sprzedaż Wyprzedane

trust-partners

Grayscale partner-logo row on a light background. Amazon link switches TLD by request.locale.iso_code; Slovenian locale shows two extra logos.

Nasi partnerzy

trust-faq

FAQ accordion, category-scoped. Reads from the faq metaobject (filtered by locale and optional currency). Click a question to expand it.

FAQ

Jakie są aktualne terminy dostawy?

Szacowane terminy dostawy są obliczane dynamicznie na podstawie wybranej konfiguracji i wyświetlane w konfiguratorze pod przyciskiem zamówienia. Jeśli chcesz opóźnić wysyłkę z powodu podróży lub wakacji, po prostu złóż zamówienie i wyślij nam e-mail — zaplanujemy wysyłkę zgodnie z preferowaną datą dostawy.

Czy mogę opóźnić wysyłkę mojego zamówienia?

Tak. Jeśli wyjeżdżasz na wakacje lub chcesz otrzymać biurko w późniejszym terminie, po prostu złóż zamówienie, a następnie wyślij nam e-mail. Chętnie zaplanujemy wysyłkę zgodnie z preferowaną datą dostawy.

Czy można usunąć dołączone listwy zasilające?

Tak, jest to bardzo proste, ponieważ listwy są przymocowane śrubami do pokrywy, jak pokazano na załączonym filmie. Wystarczy przesunąć je w lewo lub w prawo.

Czy musisz trzymać przycisk, aby zmienić wysokość biurka z jednej zapisanej wcześniej pozycji na inną?

Nie. Wystarczy jedno delikatne naciśnięcie!

Czy można kupić biurko ErgoHide i później zamówić dodatkowe akcesoria?

Tak, wszystkie nasze biurka są wcześniej przygotowane do wszystkich kompatybilnych dodatków, więc możesz zdecydować się na aktualizację w dowolnym późniejszym czasie.

Czy biurko stojące jest dla mnie odpowiednie?

Biurka stojące są odpowiednie dla każdego, kto spędza dużo czasu przy biurku i chce zmniejszyć obciążenie pleców, poprawić zdrowie i produktywność. Są również polecane dla osób z problemami zdrowotnymi, takimi jak bóle pleców czy szyi.

Jakie są korzyści z używania biurka stojącego?

Używanie biurka stojącego ma wiele korzyści, w tym zmniejszenie obciążenia pleców, poprawę postawy i zdrowia, zwiększenie produktywności i pobudzenie kreatywności.

Jak wybrać odpowiednie biurko stojące dla siebie?

Przy wyborze biurka stojącego należy rozważyć rozmiar i kształt biurka, materiał i kształt podstawy, zakres regulacji wysokości, prędkość mechanizmu podnoszącego i opuszczającego blat oraz inne oferowane funkcje. Zaleca się skonsultowanie się z ekspertem przed dokonaniem zakupu.

customer-photos

Customer-setup carousel. The snippet emits the data script; the Vue Carousel is lazy-mounted by all.js once #customer-photos-carousel scrolls near the viewport.

videos-section

Feature-video grid. Reads the videos metaobject collection and filters per product context (none here, so unboxing + generic assembly videos are shown). Click a thumbnail to open the YouTube / MP4 popup (requires video-popup rendered on the same page — included below).

Obejrzyj nasze filmy

Wideo z instrukcją montażu
Właśnie otrzymałeś biurko? W tym filmie znajdziesz szczegółowe wskazówki dotyczące całego procesu montażu.
Przed / Po
Obejrzyj film i zobacz, jak jeden z klientów odświeżył swoje biuro.
Rozpakowywanie

Locale-aware text

These snippets output text that depends on localization.country.currency.iso_code and request.locale.iso_code. Switch the currency/locale in the theme toolbar to see variants.

free-shipping

Current output for the active locale/currency:

DARMOWA WYSYŁKA do WSZYSTKICH krajów UE!
phone-number

USD → US number; everything else → EU number.

+49 15888 279287