Skip to content
Fjord Design System with a focus on interface design and modern components from ZORC
Fjord – screenshot 2
Fjord – screenshot 3
// COLOUR PALETTE
Fjord Djupblå Primary #0F172A
Arktisk Snö Background #F8FAFC
Glaciärblå Accent #38BDF8
Skiffergrå Secondary #475569
Midnatt Surface #020617
// Minimal UI kit

Fjord

Fjord-style design system for AI-driven development

25 kr

One-time payment • VAT included • Source code included

Components
10
Tech stack
React, Tailwind CSS, TypeScript, Lucide Icons, Inter Font
Licence
Commercial
Delivery
Instant access (zip + Git)
Updated

About this kit

A modern UI Kit with Fjord aesthetics. Contains ready-made components for rapid prototyping and production.

Components included

Knappsystem Form fields Datatabeller Sidonavigering Modaler Statistikkort Toasts Dropdown-menyer Badges Avatarer

Features

  • Full dark mode support
  • WCAG AA contrast level
  • Optimized for AI prompting
  • Responsive design for all devices
  • Modular token system
  • Finished layout pages

When does this kit fit?

saas dashboard admin internal-tool

Tech stack

React Tailwind CSS TypeScript Lucide Icons Inter Font

How to use this kit

  1. Step 01

    Download

    Sign in to ZORC and fetch the zip from your purchases. All source code and documentation is included.

  2. Step 02

    Copy into your project

    Drop the components/ folder into your project — or install via package.json if the kit is packaged for npm.

  3. Step 03

    Wire up design tokens

    The tokens/ folder holds colours, typography and spacing for your Tailwind config or CSS variables.

  4. Step 04

    Start building

    Import the components and use them straight away. Each one ships with examples, props and variants in the docs.

Example AI prompt

Build a dashboard for an analysis tool with Fjord UI Kit. Use the side navigation on the left and create three statistics cards at the top that show real-time user, revenue and conversion data. Center a sortable data table below the cards and ensure that the entire view uses the minimalist Nordic style with high contrast and generous airy space.

Common questions

What does Fjord include?
Fjord includes 10 components, including Knappsystem, Form fields, Datatabeller, Sidonavigering and more.
What tech stack is Fjord built on?
Fjord is built with React, Tailwind CSS, TypeScript, Lucide Icons, Inter Font.
Are the components accessible?
Yes. They follow WCAG 2.1 AA where the content allows — focus rings, keyboard support, ARIA and contrast.
What licence do I get?
Commercial. You may use the components across your organisation's paid projects. What you cannot do is resell the kit itself.
How do I get started?
Copy in the components/ folder, add the design tokens and start building. A full guide ships with the kit.
Do I get updates?
Yes. All future versions are included at no extra cost for as long as the kit remains in the catalogue.
// More UI kits

More kits from ZORC