stable1.16.1
Actions
Button
Trigger clear commands with consistent states and target size.
@uj/design/componentsUJ design system
Components
56 released components and 11 visible candidate provide tested foundations for public and protected UJ experiences.
stable1.16.1
Actions
Icon button
Trigger a familiar compact command with an accessible name and tooltip.
@uj/design/componentsstable1.16.1
Actions
Text link
Navigate to a destination using recognisable link presentation.
@uj/design/componentscandidate2.0.13
Administration
Action panel
Present permission-aware navigation to priority administration tasks.
@uj/design/adminstable1.16.1
Administration
Administration page header
Orient staff and expose page-level actions.
@uj/design/adminstable1.16.1
Administration
Administration shell
Provide a consistent protected workspace layout.
@uj/design/adminstable1.16.1
Administration
Audit timeline
Present chronological governance evidence.
@uj/design/adminstable1.16.1
Administration
Metric grid
Present operational totals in a scan-friendly definition list.
@uj/design/admincandidate2.0.13
Administration
Panel
Group one bounded task with optional context, actions and supporting footer content.
@uj/design/adminstable1.16.1
Administration
Responsive data table
Display comparable governed records with accessible overflow.
@uj/design/admincandidate2.0.13
Administration
Review queue
Turn priority findings into clear, accessible remediation tasks.
@uj/design/adminstable1.16.1
Administration
Role assignment
Present scoped authorization evidence and expiry without owning permission logic.
@uj/design/adminstable1.16.1
Administration
Workflow actions
Group review, approval, publication and withdrawal commands.
@uj/design/admincandidate2.0.13
Administration
Workflow steps
Show progress through a short, ordered workflow without inferring business state.
@uj/design/componentsstable1.16.1
Domain summaries
Department summary
Summarise a governed academic department.
@uj/design/patternsstable1.16.1
Domain summaries
Document summary
Summarise an approved institutional document.
@uj/design/patternsstable1.16.1
Domain summaries
FAQ disclosure
Present a verified question and answer.
@uj/design/patternsstable1.16.1
Domain summaries
News summary
Summarise a published News record.
@uj/design/patternsstable1.16.1
Domain summaries
Programme summary
Summarise a published Programme with decision fields.
@uj/design/patternsstable1.16.1
Domain summaries
Staff summary
Summarise a published Staff profile.
@uj/design/patternsstable1.16.1
Feedback
Access denied state
Explain an authorization boundary without exposing privileged details.
@uj/design/componentsstable1.16.1
Feedback
Alert and callout
Present important status and recovery information.
@uj/design/componentsstable1.16.1
Feedback
Empty state
Explain an absent result and provide a useful next action.
@uj/design/componentsstable1.16.1
Feedback
Loading state
Announce a bounded wait without changing the surrounding layout.
@uj/design/componentsstable1.16.1
Feedback
Status badge
Communicate a compact record status without colour-only meaning.
@uj/design/componentsstable1.16.1
Feedback
Unavailable state
Explain a temporary service failure and provide a recovery path.
@uj/design/componentsstable1.16.1
Forms
Checkbox and radio
Collect multi-select or single-select decisions using native controls.
@uj/design/componentscandidate2.0.13
Forms
Choice card
Present a native radio or checkbox choice with decision-supporting context.
@uj/design/componentsstable1.16.1
Forms
Error summary
Summarise validation failures and link people to each invalid field.
@uj/design/componentscandidate2.0.13
Forms
Fieldset
Group related controls beneath one programmatically associated legend, hint and error.
@uj/design/componentscandidate2.0.13
Forms
File input
Collect a file with an explicit label, constraints and linked validation feedback.
@uj/design/componentscandidate2.0.13
Forms
Form actions
Group the commands that save, submit, cancel or otherwise advance a form.
@uj/design/componentsstable1.16.1
Forms
Form field
Associate labels, hints, inputs and errors without ambiguity.
@uj/design/componentscandidate2.0.13
Forms
Form section
Organise one meaningful part of a longer form with a named heading and supporting context.
@uj/design/componentsstable1.16.1
Forms
Input
Collect a short text value within a labelled field.
@uj/design/componentscandidate2.0.13
Forms
Profile information editor
Present the complete governed profile architecture across staff-authored narrative, structured records and official read-only data.
@uj/design/componentsstable1.16.1
Forms
Search field
Submit a bookmarkable GET search with a visible command.
@uj/design/componentsstable1.16.1
Forms
Select
Choose one value from a bounded native option set.
@uj/design/componentsstable1.16.1
Forms
Textarea
Collect a longer free-text value within a labelled field.
@uj/design/componentsstable1.16.1
Forms
Toggle
Change an immediately applied binary setting.
@uj/design/componentsstable1.16.1
Navigation
Accordion
Disclose secondary content using native details behaviour.
@uj/design/navigationstable1.16.1
Navigation
Back to top
Return people to the start of a long page using one accessible, motion-aware control.
@uj/design/back-to-topstable1.16.1
Navigation
Brand lockup
Present the approved UJ mark and application identity.
@uj/design/navigationstable1.16.1
Navigation
Breadcrumbs
Show the current page within its canonical UJ hierarchy.
@uj/design/navigationstable1.16.1
Navigation
Local navigation and tabs
Navigate a bounded section or record workspace.
@uj/design/navigationstable1.16.1
Navigation
Locale selector
Navigate between explicitly available translations without silent fallback.
@uj/design/navigationstable1.16.1
Navigation
Pagination
Expose large archives through crawlable numbered links.
@uj/design/navigationstable1.16.1
Navigation
Site header
Provide consistent application identity and primary navigation.
@uj/design/navigationcandidate2.0.13
Navigation
Site settings
Combine language, appearance and four curated UJ design presets in one accessible settings menu.
@uj/design/theme-controlstable1.16.1
Navigation
Tabs
Switch between peer views using crawlable navigation links.
@uj/design/navigationstable1.16.1
Navigation
Translation controls
Navigate available page translations and disclose AI-assisted translations in English.
@uj/design/componentsstable1.16.1
Public patterns
Archive controls
Search and filter large published collections using bookmarkable GET parameters.
@uj/design/patternsstable1.16.1
Public patterns
Editorial hero
Lead a genuine institutional priority with approved media or strong contrast.
@uj/design/patternsstable1.16.1
Public patterns
Faculty departments
Present the authoritative academic Departments for one faculty.
@uj/design/patternsstable1.16.1
Public patterns
Faculty news
Present the latest published News for one faculty.
@uj/design/patternsstable1.16.1
Public patterns
Faculty programmes
Present published Programmes for one faculty.
@uj/design/patternsstable1.16.1
Public patterns
News slider
Present a curated published News collection in an accessible horizontal rail.
@uj/design/news-sliderstable1.16.1
Public patterns
Page header
Introduce a public page with clear hierarchy and context.
@uj/design/patternsstable1.16.1
Public patterns
Record grid
Arrange authoritative record summaries without nested cards.
@uj/design/patternsstable1.16.1
Public patterns
Section heading
Pair a concise heading with supporting context.
@uj/design/patternsstable1.16.1
Structure
Container and section
Constrain page content and provide consistent section rhythm.
@uj/design/componentsstable1.16.1
Structure
Divider
Separate related content without creating a decorative panel.
@uj/design/componentsstable1.16.1
Structure
Media figure
Pair approved media with accessible alternative text and a caption.
@uj/design/patternsstable1.16.1
Structure
Rich text
Render governed long-form content with a controlled reading measure.
@uj/design/patternsstable1.16.1
Structure
Skip link
Move keyboard users directly to the main content.
@uj/design/componentsstable1.16.1
Structure
Stack and grid
Arrange content with governed spacing and responsive tracks.
@uj/design/componentsstable1.16.1
Structure
Visually hidden content
Provide screen-reader context without visible duplication.
@uj/design/components