NewsKit offers a robust and flexible theming system, enabling brands to retain a unique identity while building consistent, accessible products.
NewsKit foundations define the look and feel of digital products. Foundations include borders, breakpoints, colours, fonts, motion, shadows, sizing and space.
Overlays are used for styling UI elements. They can be decorative, but often have a functional use like communicating state on images or increasing the contrast backgrounds when a component is layered upon each other, e.g. a modal.
A collection of related foundational design tokens combined into a preset to define reusable styles, typography or transitions. There are three categories of presets:
Creating and using themes
Learn how to create NewsKit themes in Figma and code, and unlock the power of presets and component defaults to further customise NewsKit components.