Skip to content

Example theme:

Main Navigation

Appearance

Sidebar Navigation

Welcome to Warp

Getting started

Developers

Web

Android

iOS

Designers

Migration to Warp

Developers guide

Designers guide

CSS

Introduction

UnoCSS - what's that?

Class Variants

Hover, Focus and other states

Helper classes

Layout

Aspect Ratio

Columns

Break After

Break Before

Break Inside

Box Sizing

Display

Floats

Clear

Isolate

Object Fit

Object Position

Overflow

Overscroll

Position

Top / Right / Bottom / Left

Visibility

Z-Index

Sizing

Width

Min-Width

Max-Width

Height

Min-Height

Max-Height

Typography

Font Size

Font Style

Font Weight

Font Variant Numeric

Line Height

List Style Position

List Style Type

Text Align

Text Color

Text Decoration

Text Transform

Text Overflow

Vertical Align

Whitespace

Word Break

Content

Iconography

Icon Color

Backgrounds

Background Attachment

Background Clip

Background Color

Background Origin

Background Position

Background Repeat

Background Size

Background Image

Spacing

Padding

Margin

Space between

Flexbox & Grid

Flex

Flex Basis

Flex Direction

Flex Grow

Flex Shrink

Flex Wrap

Order

Grid Template Columns

Grid Column Start / End

Grid Template Rows

Grid Row Start / End

Grid Auto Flow

Grid Auto Columns

Grid Auto Rows

Gap

Justify Content

Justify Items

Justify Self

Align Content

Align Items

Align Self

Place Content

Place Items

Place Self

Border

Border Radius

Border Width

Border Color

Border Style

Divide Width

Divide Color

Divide Style

Outline Style

Outline Width

Outline Color

Outline Offset

Effects

Box Shadow

Drop Shadow

Opacity

Filters

Backdrop Blur

Tables

Border Collapse

Border Spacing

Table Layout

Transitions & Animation

Transition Property

Transition Duration

Transition Timing

Transition Delay

Animation

Transforms

Scale

Rotate

Translate

Skew

Transform Origin

Interactivity

Appearance

Caret

Cursor

Pointer Events

Resize

Scroll Behavior

Scroll Snap Align

Scroll Snap Stop

Scroll Snap Type

Touch Action

User Select

Will Change

Accessibility

Screen Readers

Components

Actions

Button

Button Group

Pill

Forms

Checkbox

Combobox

Radio

Radio Buttons

Select

Slider

Switch

Text Area

Text Field

Feedback

Alert

Steps

Icons

Layout

Badge

Box

Broadcast

Card

Expandable

Tabs

Text

Toast

Utilities

Navigation

Breadcrumbs

Pagination

Overlays

Attention

Callout

Modal

Spinner

Tooltip

Guidelines

Designing with a system

Building Custom Elements with Warp

Data visualisation

Getting Started

Chart types

Colour Usage

Success criteria

Collaborate with us

Contribute to Warp

Join the community

On this page

Welcome to WARP!

The WARP logo surrounded by the logos of Blocket, FINN, Tori, Oikotie, Bilbasen and DBA.

If you are going to design or develop for Schibsted Nordic Marketplaces you are in the right place! Warp is the design system for all our marketplaces.

A good place to start is Getting started for developers or Getting started for designers.

Pager

Released under the Apache 2.0 License.

Copyright © 2023-present Schibsted