www.meshdesignsystem.com
Open in
urlscan Pro
2606:4700:3031::ac43:cf58
Public Scan
URL:
https://www.meshdesignsystem.com/
Submission: On February 22 via manual from US — Scanned from DE
Submission: On February 22 via manual from US — Scanned from DE
Form analysis 1 forms found in the DOM
<form role="search"><input type="search" value="" aria-label="Search through site content" class="esm__StyledTextbox-qm2xm7-0 gzQRic Search__SearchInput-sc-1fulz59-2 fTcRXq"></form>Text Content
Design Develop Analytics Feedback DESIGN DEVELOP ANALYTICS FEEDBACK GETTING STARTED * Overview * Design principles * Design * Develop * Browser support * Tech support Accessibility * Accessibility statement * Designing for accessibility * Accessibility checklist FOUNDATIONS * Overview * Colors New * Typography Updated * Imagery Updated * Breakpoints * Spacing * Layout New Iconography * Usage * System icons * Graphic icons COMPONENTS * Overview * Component status * Accordion * Alert * Autocomplete * Button * Card * Checkbox * Checkbox Group * Copy * Date Picker * Date Textbox * Divider * Error Template * Expander * Expander Group * Feature Panel * File Upload New * Footer * Fonts New * Form * Form Control * Grow Layout * Header * Header Footer Layout * Heading * Hero Panel * Icons * Info Box * Link * Loader * Logo * Modal * Overlay * Product Card * Radio * Radio Button * Radio Group * React HTML * Select * Simple Table * Skip Link * Table New * Tabs * Tag * Textarea * Textbox * Theme * Tooltip * Utility Button * Villain Panel Layout components * Box * Column * Columns * Container * Hidden * Inline * Section * Split Section New * Stack * Tiles RESOURCES * Analytics New * Figma libraries * Playroom * Storybook * Static site starter * CSS Framework * Device templates Brand * Overview * nib logos Updated * nib co-brand logos New * GU Health logos * IMAN logos * Brand imagery New Email * Style guide * Templates * nib newsletter template * nib kitchen sink template * GU Health kitchen sink template TEAM * How to contribute * Raise an issue * Feedback * Roadmap Announcements * Rebrand released New * Card variations * New navigation released CONTRIBUTING How to contributeRaise an issue NEED HELP? SlackEmailRoadmap MESH ENABLES TEAMS TO CREATE HIGH-QUALITY PRODUCTS AND EXPERIENCES FASTER FOR OUR MEMBERS. GETTING STARTED nib’s Mesh Design System enables teams to create cohesive, high-quality products and experiences faster for our existing and prospective members, providers and partners. Get started with Mesh Design principles DESIGN PRINCIPLES These principles underlie the way we ‘do design’ at nib. They encourage us to continue striving to produce elegant products and solutions that best balance the needs of our end users with our business goals. Accessibility ACCESSIBILITY Accessibility enables people with physical and cognitive disabilities, situational disabilities and technology limitations to perceive and interact with the digital experiences we create. Foundations FOUNDATIONS Our Foundations library covers nib’s use of color, typography, imagery, iconography, layout and spacing, to ensure consistency across our digital products and services. DESIGN Designing digital products and services with Mesh can help to make your work easier, by utilising established design patterns and leveraging tooling such as Figma component libraries and Playroom. Learn more about designing with Mesh Figma libraries FIGMA LIBRARIES Our Figma libraries provide reusable components and styles to help you craft great products and design quickly for fast prototyping in high fidelity. Layout LAYOUT Mesh provides a set of utility layout components which manage structure and spacing between elements. Playroom PLAYROOM Playroom allows you to quickly experiment with real Mesh components, real interactivity and real limitations of both the system and the web platform. DEVELOP Develop better experiences quickly and efficiently with Mesh, leveraging our React Component library, site starter templates and tooling like Storybook to effectively implement your designs to code. Learn more about developing with Mesh Components COMPONENTS Mesh’s library of React Components form the building-blocks for all nib experiences, from forms and interactive elements to commonly used content and messaging patterns. Storybook STORYBOOK Storybook allows you to quickly experiment with real Mesh components, real interactivity and real limitations of both the system and the web platform. Static site starter STATIC SITE STARTER Our static site starter has been created as a template repository for creating your own repo, utilising Gatsby, a React-based open source framework for creating websites and apps. RESOURCES Quickly navigate to commonly accessed resources for nib’s internal teams and external partners. Brand BRAND Our library of brand assets includes logos for nib and its partners, email templates and brand imagery guidelines to ensure consistent tone-of-voice through our use of visual assets. Iconography ICONOGRAPHY nib’s icon library includes system and graphic icon assets, designed for visual consistency and communication across sizes and contexts. CSS Framework CSS FRAMEWORK Designed as a standalone library independent of any javascript frameworks, our CSS Framework provides component-agnostic utility classes that allow for design flexibility while maintaining alignment with nib’s digital assets. CONTRIBUTING How to contributeRaise an issue NEED HELP? SlackEmailRoadmap Copyright © 2023 nib Group. nib is not responsible for the content of external sites. We acknowledge Aboriginal and Torres Strait Islander peoples as the Traditional Custodians of the lands where we live, learn and work. View our Reconciliation Action Plan