Skip to main content
MybringDesign System

Mybring Design System

Mybring provides logistics and warehousing management for Bring customers. This dedicated design system holds documentation and technical solutions that help us build Mybring’s interfaces and integration documentation.

Documentation

Basics

How to use the design system, set up applications and our approach to CSS. Based on modern code practices, national standards and accessibility principles.

Documentation

Guidelines

Guidelines to layout, responsiveness, navigation and text. How to structure an application, format numbers, write better texts and use common terms.

Documentation

Components

CSS scoped to HTML elements serving as building blocks for making interface parts. Also contains icons, React components and a Chart.js configuration.

Documentation

Utilities

Small pieces of CSS for styling and layout of HTML elements, including things like spacing, sizing, flexbox and font properties.

Resource

React components

A small collection of complex components for React applications.

Resource

Icons

Icons for applications and interfaces, and to represent certain Bring services or service families.

Tool

Mybring Prototype

A frontend app for producing prototypes with HTML and CSS in a replicated Mybring layout. Useful for exploration, collaboration and when we haven’t set up a full app yet.

Resource

Chart.js config

A common configuration for different recommended chart types with accessibility tested colours.

Resource

Mybring CSS

The core of the system, delivered to Mybring apps through Layout. Otherwise, link to it in the head element.

Tool

Sandbox CSS

A complete alternative to Mybring CSS for testing changes and features over time in a dedicated canary in all environments.