Developer reference

AM Industries design system

Reusable layout, typography, action and content patterns for composing AM Industries pages. This page is intentionally excluded from search indexing.

Design tokens

Use semantic tokens and explicit section tones. Page appearance must never depend on section order.

Primaryvar(--color-primary)
Accentvar(--color-accent)
Pagevar(--color-surface-page)
Mutedvar(--color-surface-muted)
Darkvar(--color-surface-dark)
<Section tone="muted" spacing="normal">
  <Container>...</Container>
</Section>

Buttons and panels

Buttons own interaction states and sizing. Panels provide a restrained supporting surface with optional brand accents.

Green accent

Use for practical guidance and positive supporting content.

Purple accent

  • Clear hierarchy
  • Consistent spacing
  • Reusable states
<Button href="/contact-us">Primary action</Button>
<Button variant="secondary">Secondary</Button>
<Panel accent="green">...</Panel>

Layout primitives

Container controls readable width. Grid, Stack and SplitLayout arrange content without imposing a visual surface.

Content remains semantic

Layout components control relationships between elements while content components retain their own meaning and accessibility.

AM Industries workshop and engineering work
<SplitLayout ratio="wide-left">
  <Prose>...</Prose>
  <Panel>...</Panel>
</SplitLayout>

Form fields

FormField connects labels, hints and errors while preserving native input behaviour.

Include approximate measurements when available.

<FormField label="Email" required>
  <input type="email" name="email" required />
</FormField>

Domain patterns

Content components

These components express recurring AM Industries content rather than generic layout.

A testimonial component gives customer evidence a distinct, readable voice without turning it into another card grid.
Example attributionDemonstration content only
30+years of experience
Rushlocal workshop
Irelandnationwide support
Component example

A stronger proof statement for high-value company statistics.

30+years of experience
7core service areas
1team from fabrication to support

How it works

Process steps

Use when a customer needs to understand sequence and responsibility.

  1. 01

    Enquire

    Share the site and the requirement.

  2. 02

    Specify

    Confirm operation, safety and finish.

  3. 03

    Deliver

    Fabricate, install and hand over.

A metal fabricator welding a steel gate assembly in an engineering workshop

Component example

Project evidence with context

ProjectSpotlight pairs one meaningful image with a concise project narrative and a clear next action.

Discuss a similar project

Before you enquire

FAQ accordion

When should an FAQ be used?

Use it for recurring customer questions that affect decisions or enquiry quality.

How many items work well?

Four to seven focused questions are usually enough for a page section.

Direct contact

Speak to the team

Choose the route that suits your enquiry. Site photos and approximate measurements are useful when available.