Getting started for designers
How to get going with designing for your project using Luna.
Luna's design foundations
Luna is a multi-brand design system. We want each brand to remain unique, but also to share things where consistent standards and approaches will create better experiences for users. This idea applies to everything that we do.
Colour
Brands have individual colours, but share a monochrome and semantic palette.Typography
The typography system provides a flexible approach that can be applied to individual brand fonts.Layout
Read about spacing, grids, gutters and margins and how they vary across breakpoints.Design tokens
Learn how to use design tokens to build and maintain consistent user interfaces.Accessing and using our UI design kits
We have UI design kits for use in Figma for Sainsbury’s, Argos, Nectar, Habitat and Tu.
If you’re a Sainsbury’s colleague
UI design libraries for each brand will be switched on within Figma. You can also duplicate our UI design kit from our community page.If you’re a third party or agency
If you’re designing from outside Sainsbury’s organisation, you’ll need to duplicate the UI design kit from our community page.Our UI design libaries contain:
Colour Styles
Global monochrome and semantic palettes as well as brand colours.Text Styles
Brand and global typefaces at different display sizes.Grid Styles
Grids for mobile, tablet and desktop, with Android and iOS variants available.Components
A core set of components for each brand within the assets tab.Icons
Each brand’s icon suite within the assets tab.Guidelines for designers
How to use components
Find guidance on how to use Luna components.Designing for accessibility
Read accessiblity guidance for digital.Designing digital content
Tone of voice, style guides and best practices for content.Get in touch
Our design team are on hand to answers questions or help with your project.