{
"api": {
"version": "1.0.0",
"baseUrl": "https://api.seb.io",
"lastUpdated": "2026-04-28T07:29:02.364Z",
"resources": {
"home": {
"endpoint": "home.json",
"content": {
"title": "Green Design System",
"summary": "is built to support creation of beautiful, consistent and accessible financial products for generations to come.",
"path": "home.json"
}
},
"components": {
"list": "components/components.json",
"items": [
{
"title": "Alert",
"slug": "alert",
"summary": "An alert displays important messages, feedback, or time-sensitive information.",
"path": "components/alert/alert.content.json",
"endpoints": {
"content": "components/alert/alert.content.json",
"images": "components/alert/alert.images.json"
}
},
{
"title": "Avatar",
"slug": "avatar",
"path": "components/avatar/avatar.content.json",
"endpoints": {
"content": "components/avatar/avatar.content.json",
"images": "components/avatar/avatar.images.json"
}
},
{
"title": "Badge",
"slug": "badge",
"summary": "A compact visual indicator for status, counts and notifications.",
"path": "components/badge/badge.content.json",
"endpoints": {
"content": "components/badge/badge.content.json",
"images": "components/badge/badge.images.json"
}
},
{
"title": "Blur",
"slug": "blur",
"summary": "The Blur component is used to apply a blur effect over content, often used to obscure sensitive or background information.",
"path": "components/blur/blur.content.json",
"endpoints": {
"content": "components/blur/blur.content.json",
"images": "components/blur/blur.images.json"
}
},
{
"title": "Breadcrumbs",
"slug": "breadcrumbs",
"summary": "A breadcrumb is a secondary navigation showing the website hierarchy.",
"path": "components/breadcrumbs/breadcrumbs.content.json",
"endpoints": {
"content": "components/breadcrumbs/breadcrumbs.content.json",
"images": "components/breadcrumbs/breadcrumbs.images.json"
}
},
{
"title": "Button",
"slug": "button",
"summary": "A button can be tapped or clicked to perform an action.",
"path": "components/button/button.content.json",
"endpoints": {
"content": "components/button/button.content.json",
"images": "components/button/button.images.json"
}
},
{
"title": "Calendar",
"slug": "calendar",
"summary": "The calendar displays a grid of selectable dates.",
"path": "components/calendar/calendar.content.json",
"endpoints": {
"content": "components/calendar/calendar.content.json",
"images": "components/calendar/calendar.images.json"
}
},
{
"title": "Card pattern 01",
"slug": "card-pattern-01",
"summary": "Card pattern 01 is a pre-built composition based on the card component.",
"path": "components/card-pattern-01/card-pattern-01.content.json",
"endpoints": {
"content": "components/card-pattern-01/card-pattern-01.content.json",
"images": "components/card-pattern-01/card-pattern-01.images.json"
}
},
{
"title": "Card",
"slug": "card",
"summary": "The card groups related content into a single container.",
"path": "components/card/card.content.json",
"endpoints": {
"content": "components/card/card.content.json",
"images": "components/card/card.images.json"
}
},
{
"title": "Checkbox",
"slug": "checkbox",
"summary": "A checkbox is a form control that allows users to select one or multiple options.",
"path": "components/checkbox/checkbox.content.json",
"endpoints": {
"content": "components/checkbox/checkbox.content.json",
"images": "components/checkbox/checkbox.images.json"
}
},
{
"title": "Coachmark",
"slug": "coachmark",
"summary": "Coachmarks guide users through interface features.",
"path": "components/coachmark/coachmark.content.json",
"endpoints": {
"content": "components/coachmark/coachmark.content.json",
"images": "components/coachmark/coachmark.images.json"
}
},
{
"title": "Context menu",
"slug": "context-menu",
"summary": "A context menu displays a list of contextual actions.",
"path": "components/context-menu/context-menu.content.json",
"endpoints": {
"content": "components/context-menu/context-menu.content.json",
"images": "components/context-menu/context-menu.images.json"
}
},
{
"title": "Datepicker",
"slug": "datepicker",
"summary": "The datepicker allows users to select a date.",
"path": "components/datepicker/datepicker.content.json",
"endpoints": {
"content": "components/datepicker/datepicker.content.json",
"images": "components/datepicker/datepicker.images.json"
}
},
{
"title": "Details",
"slug": "details",
"summary": "The details component is a collapsible section that helps organize and hide content until needed.",
"path": "components/details/details.content.json",
"endpoints": {
"content": "components/details/details.content.json",
"images": "components/details/details.images.json"
}
},
{
"title": "Dialog",
"slug": "dialog",
"summary": "A dialog appears in front of content to provide critical information or ask for a decision.",
"path": "components/dialog/dialog.content.json",
"endpoints": {
"content": "components/dialog/dialog.content.json",
"images": "components/dialog/dialog.images.json"
}
},
{
"title": "Div",
"slug": "div",
"summary": "Div is a base element in the declarative layout system.",
"path": "components/div/div.content.json",
"endpoints": {
"content": "components/div/div.content.json",
"images": "components/div/div.images.json"
}
},
{
"title": "Divider",
"slug": "divider",
"summary": "Divider creates visual and semantic separation between content.",
"path": "components/divider/divider.content.json",
"endpoints": {
"content": "components/divider/divider.content.json",
"images": "components/divider/divider.images.json"
}
},
{
"title": "Dropdown",
"slug": "dropdown",
"summary": "A dropdown enables the user to choose one or multiple options from a list.",
"path": "components/dropdown/dropdown.content.json",
"endpoints": {
"content": "components/dropdown/dropdown.content.json",
"images": "components/dropdown/dropdown.images.json"
}
},
{
"title": "FAB",
"slug": "fab",
"summary": "Floating action button persists across screens for constant access to features that needs to be accessible at all times.",
"path": "components/fab/fab.content.json",
"endpoints": {
"content": "components/fab/fab.content.json",
"images": "components/fab/fab.images.json"
}
},
{
"title": "Filter chips",
"slug": "filter-chips",
"summary": "Filter chips allow users to narrow down the data they want to see on the page.",
"path": "components/filter-chips/filter-chips.content.json",
"endpoints": {
"content": "components/filter-chips/filter-chips.content.json",
"images": "components/filter-chips/filter-chips.images.json"
}
},
{
"title": "Flex",
"slug": "flex",
"path": "components/flex/flex.content.json",
"endpoints": {
"content": "components/flex/flex.content.json",
"images": "components/flex/flex.images.json"
}
},
{
"title": "Form summary",
"slug": "form-summary",
"summary": "Form summary shows all form errors in one place.",
"path": "components/form-summary/form-summary.content.json",
"endpoints": {
"content": "components/form-summary/form-summary.content.json",
"images": "components/form-summary/form-summary.images.json"
}
},
{
"title": "Grid",
"slug": "grid",
"summary": "The grid is a custom element that provides a flexible grid system.",
"path": "components/grid/grid.content.json",
"endpoints": {
"content": "components/grid/grid.content.json",
"images": "components/grid/grid.images.json"
}
},
{
"title": "Icon",
"slug": "icon",
"summary": "An icon helps communicate meaning quickly, enhances visual hierarchy, and supports navigation or interaction.",
"path": "components/icon/icon.content.json",
"endpoints": {
"content": "components/icon/icon.content.json",
"images": "components/icon/icon.images.json"
}
},
{
"title": "Image",
"slug": "image",
"summary": "An image displays media with configurable dimensions and styling properties.",
"path": "components/image/image.content.json",
"endpoints": {
"content": "components/image/image.content.json",
"images": "components/image/image.images.json"
}
},
{
"title": "Input",
"slug": "input",
"summary": "An input lets users enter and edit text or numerical values in forms.",
"path": "components/input/input.content.json",
"endpoints": {
"content": "components/input/input.content.json",
"images": "components/input/input.images.json"
}
},
{
"title": "Link",
"slug": "link",
"summary": "A link navigates users to other pages or sections of content.",
"path": "components/link/link.content.json",
"endpoints": {
"content": "components/link/link.content.json",
"images": "components/link/link.images.json"
}
},
{
"title": "Menu button",
"slug": "menu-button",
"summary": "A menu button combines button and link behaviors for navigation menus.",
"path": "components/menu-button/menu-button.content.json",
"endpoints": {
"content": "components/menu-button/menu-button.content.json",
"images": "components/menu-button/menu-button.images.json"
}
},
{
"title": "Pagination",
"slug": "pagination",
"summary": "Pagination helps users navigate large result sets by dividing content into clear, manageable pages. ",
"path": "components/pagination/pagination.content.json",
"endpoints": {
"content": "components/pagination/pagination.content.json",
"images": "components/pagination/pagination.images.json"
}
},
{
"title": "Popover",
"slug": "popover",
"summary": "A popover is a temporary view that appears above other content.",
"path": "components/popover/popover.content.json",
"endpoints": {
"content": "components/popover/popover.content.json",
"images": "components/popover/popover.images.json"
}
},
{
"title": "Radio",
"slug": "radio",
"summary": "A radio button is a form control that allows users to select one of the predefined set of choices.",
"path": "components/radio/radio.content.json",
"endpoints": {
"content": "components/radio/radio.content.json",
"images": "components/radio/radio.images.json"
}
},
{
"title": "Rich text",
"slug": "rich-text",
"summary": "Rich text can be used to wrap generic HTML content and apply typography styles.",
"path": "components/rich-text/rich-text.content.json",
"endpoints": {
"content": "components/rich-text/rich-text.content.json",
"images": "components/rich-text/rich-text.images.json"
}
},
{
"title": "Segmented control",
"slug": "segmented-control",
"summary": "Segmented control allows users to select a single option, immediately changing the display to reflect their selection. It is used for switching views or view options, not for navigation.",
"path": "components/segmented-control/segmented-control.content.json",
"endpoints": {
"content": "components/segmented-control/segmented-control.content.json",
"images": "components/segmented-control/segmented-control.images.json"
}
},
{
"title": "Select",
"slug": "select",
"summary": "A select enables the user to choose one or multiple options from a list.",
"path": "components/select/select.content.json",
"endpoints": {
"content": "components/select/select.content.json",
"images": "components/select/select.images.json"
}
},
{
"title": "Signal",
"slug": "signal",
"summary": "A signal draws attention to notifications and new content.",
"path": "components/signal/signal.content.json",
"endpoints": {
"content": "components/signal/signal.content.json",
"images": "components/signal/signal.images.json"
}
},
{
"title": "Spinner",
"slug": "spinner",
"path": "components/spinner/spinner.content.json",
"endpoints": {
"content": "components/spinner/spinner.content.json",
"images": "components/spinner/spinner.images.json"
}
},
{
"title": "Switch",
"slug": "switch",
"summary": "A toggle lets users switch a setting on or off. ",
"path": "components/switch/switch.content.json",
"endpoints": {
"content": "components/switch/switch.content.json",
"images": "components/switch/switch.images.json"
}
},
{
"title": "Table",
"slug": "table",
"summary": "A table displays structured data for overview and comparison.",
"path": "components/table/table.content.json",
"endpoints": {
"content": "components/table/table.content.json",
"images": "components/table/table.images.json"
}
},
{
"title": "Text",
"slug": "text",
"summary": "Text summary",
"path": "components/text/text.content.json",
"endpoints": {
"content": "components/text/text.content.json",
"images": "components/text/text.images.json"
}
},
{
"title": "Textarea",
"slug": "textarea",
"summary": "Textarea allow users to input text and digits on multiple lines.",
"path": "components/textarea/textarea.content.json",
"endpoints": {
"content": "components/textarea/textarea.content.json",
"images": "components/textarea/textarea.images.json"
}
},
{
"title": "Theme",
"slug": "theme",
"summary": "Theme summary",
"path": "components/theme/theme.content.json",
"endpoints": {
"content": "components/theme/theme.content.json",
"images": "components/theme/theme.images.json"
}
},
{
"title": "Video",
"slug": "video",
"summary": "Video summary",
"path": "components/video/video.content.json",
"endpoints": {
"content": "components/video/video.content.json",
"images": "components/video/video.images.json"
}
}
]
},
"navigation": {
"list": "navigation/navigation.json",
"items": [
{
"title": "Design direction",
"slug": "design-direction",
"path": "navigation/design-direction.json",
"links": 2,
"endpoint": "navigation/design-direction.json"
},
{
"title": "Main",
"slug": "main",
"path": "navigation/main.json",
"links": 9,
"endpoint": "navigation/main.json"
},
{
"title": "Primitives",
"slug": "primitives",
"path": "navigation/primitives.json",
"links": 7,
"endpoint": "navigation/primitives.json"
},
{
"title": "Spacings",
"slug": "spacings",
"path": "navigation/spacings.json",
"links": 3,
"endpoint": "navigation/spacings.json"
}
]
},
"templates": {
"list": "templates/templates.json",
"items": [
{
"title": "Login",
"slug": "login",
"path": "templates/login/login.json",
"related_components": [
"Button",
"Input"
],
"endpoint": "templates/login/login.json"
}
]
},
"pages": {
"list": "pages/pages.json",
"items": [
{
"title": "About",
"slug": "about",
"summary": "Green Design System is the design system for Skandinaviska Enskilda Banken to make it easier and faster to build beautiful digital products and experiences under the SEB brand.",
"path": "pages/about/about.json",
"endpoints": {
"content": "pages/about/about.json"
}
},
{
"title": "Accessibility",
"slug": "accessibility",
"summary": "Accessibility is central to SEB’s digital experience. The Green Design System is designed to make our services usable for everyone – improving clarity, usability, and overall experience.",
"path": "pages/accessibility/accessibility.json",
"endpoints": {
"content": "pages/accessibility/accessibility.json"
}
},
{
"title": "Applied design",
"slug": "design-direction/applied-design",
"summary": "Applied design shows how our visual design comes to life in concrete examples - with templates and clear guidance for building layouts.",
"path": "pages/design-directionapplied-design/design-directionapplied-design.json",
"endpoints": {
"content": "pages/design-directionapplied-design/design-directionapplied-design.json"
}
},
{
"title": "Visual direction",
"slug": "design-direction/visual-direction",
"summary": "Our visual language helps the user to navigate, make choices and solve problems. With usability and writing as core pillars the visual design inherits the brand principles in a digital context.",
"path": "pages/design-directionvisual-direction/design-directionvisual-direction.json",
"endpoints": {
"content": "pages/design-directionvisual-direction/design-directionvisual-direction.json"
}
},
{
"title": "Design direction",
"slug": "design-direction",
"summary": "At SEB, digital design is not just about aesthetics - it’s about clarity, function, and supporting the user journey. We simplify and remove obstacles, with accessibility and writing as equal parts.",
"path": "pages/design/design.json",
"endpoints": {
"content": "pages/design/design.json"
}
},
{
"title": "Figma",
"slug": "figma",
"summary": "Figma is our core design tool, where you’ll find everything needed to create consistent and user-friendly experiences. Components, variables, and typography styles to icons and more - all in one place.",
"path": "pages/figma/figma.json",
"endpoints": {
"content": "pages/figma/figma.json"
}
},
{
"title": "Primitives",
"slug": "primitives",
"summary": "The primitives represent the fundamental parts of the design system like colors, typography, spacing, and sizing. This ensures consistency across the entire design system.",
"path": "pages/foundation/foundation.json",
"endpoints": {
"content": "pages/foundation/foundation.json"
}
},
{
"title": "Colours",
"slug": "primitives/colours",
"summary": "Colour is a powerful tool in design, shaping hierarchy, guiding attention, and reinforcing brand identity. In Green, colours work alongside whitespace and typography to create clarity and balance.",
"path": "pages/foundationcolours/foundationcolours.json",
"endpoints": {
"content": "pages/foundationcolours/foundationcolours.json"
}
},
{
"title": "Design tokens",
"slug": "primitives/design-tokens",
"summary": "Design tokens capture colors, typography, spacing, and other design decisions as named, reusable values used in designs, tools, and code - keeping interfaces consistent and easy to update.",
"path": "pages/foundationtokens/foundationtokens.json",
"endpoints": {
"content": "pages/foundationtokens/foundationtokens.json"
}
},
{
"title": "Typography",
"slug": "primitives/typography",
"summary": "Typography plays a crucial role in shaping the look and feel of our design. It not only impacts readability but also establish our brand identity.",
"path": "pages/foundationtypography/foundationtypography.json",
"endpoints": {
"content": "pages/foundationtypography/foundationtypography.json"
}
},
{
"title": "Declarative layout",
"slug": "primitives/declarative-layout",
"summary": "A micro-frontend optimized layout system for responsive layouts without utility classes. The relationships between elements rely on the set rules for spacing, grids, and sizing, ensuring consistency throughout.",
"path": "pages/layout/layout.json",
"endpoints": {
"content": "pages/layout/layout.json"
}
},
{
"title": "Icons",
"slug": "primitives/icons",
"summary": "Icons are a powerful tool in the interface. When used consistently, icons strengthen brand expression, improve usability, and create a more intuitive experience.",
"path": "pages/primitivesicon/primitivesicon.json",
"endpoints": {
"content": "pages/primitivesicon/primitivesicon.json"
}
},
{
"title": "Patterns",
"slug": "primitives/patterns",
"summary": "Patterns are reusable solutions to common design problems. They show how components, behaviour, and guidelines work together to meet a specific user or interface need.",
"path": "pages/primitivespatterns/primitivespatterns.json",
"endpoints": {
"content": "pages/primitivespatterns/primitivespatterns.json"
}
},
{
"title": "Shadows",
"slug": "primitives/shadows",
"summary": "Shadows help define hierarchy, depth, and interaction. In Green, they work together with other primitives to support clarity and visual balance.",
"path": "pages/primitivesshadows/primitivesshadows.json",
"endpoints": {
"content": "pages/primitivesshadows/primitivesshadows.json"
}
},
{
"title": "Spacings",
"slug": "spacings",
"summary": "Spacing is a fundamental tool for structuring layouts. In Green, we use spacing to create hierarchy, balance, and visual rhythm, making interfaces feel intentional and easy to navigate.",
"path": "pages/spacings/spacings.json",
"endpoints": {
"content": "pages/spacings/spacings.json"
}
},
{
"title": "Button groups",
"slug": "spacings/buttons",
"summary": "Button spacing helps create clear relationships between actions and ensures buttons feel balanced within a layout. The spacing depends on how the buttons are arranged, side by side or stacked, and should always feel visually connected to the surrounding form or content.",
"path": "pages/spacingsspacings-for-button-groups/spacingsspacings-for-button-groups.json",
"endpoints": {
"content": "pages/spacingsspacings-for-button-groups/spacingsspacings-for-button-groups.json"
}
},
{
"title": "Forms",
"slug": "spacings/forms",
"summary": "Good spacing makes forms easier to read, scan, and complete. It helps users see how fields relate to each other, creates a clear hierarchy, and ensures enough room for focus states and touch targets. Consistent spacing makes forms feel structured and effortless to use.",
"path": "pages/spacingsspacings-in-forms/spacingsspacings-in-forms.json",
"endpoints": {
"content": "pages/spacingsspacings-in-forms/spacingsspacings-in-forms.json"
}
},
{
"title": "Typography spacings",
"slug": "spacings/typography",
"summary": "Spacing in typography defines the structure and relationships between text elements such as headings, preambles, and body text. It should be used consistently to create a clear and predictable text hierarchy.",
"path": "pages/spacingstypography/spacingstypography.json",
"endpoints": {
"content": "pages/spacingstypography/spacingstypography.json"
}
},
{
"title": "UX writing",
"slug": "ux-writing",
"summary": "Wherever customers meet us, their experience of SEB should be consistent. A good experience builds trust and can lead to new business. Customer-facing text must be correct – mistakes distract and reduce credibility.",
"path": "pages/ux-writing/ux-writing.json",
"endpoints": {
"content": "pages/ux-writing/ux-writing.json"
}
}
]
},
"snippets": {
"list": "snippets/snippets.json",
"items": [
{
"title": "Alert: Action",
"slug": "alert-action",
"path": "snippets/alert-action/alert-action.json",
"code": "\n \n Actionable Alert with a button for quick user interaction.\n \n",
"endpoints": {
"content": "snippets/alert-action/alert-action.json"
}
},
{
"title": "Alert: Auto Dismiss",
"slug": "alert-auto-dismiss",
"path": "snippets/alert-auto-dismiss/alert-auto-dismiss.json",
"code": "\n \n Auto DismissThis alert disappears automatically after a delay.\n \n",
"endpoints": {
"content": "snippets/alert-auto-dismiss/alert-auto-dismiss.json"
}
},
{
"title": "Alert: Dissmisible",
"slug": "alert-dismissible",
"path": "snippets/alert-dismissible/alert-dismissible.json",
"code": "\n \n Dismissible User can dismiss this alert.\n \n",
"endpoints": {
"content": "snippets/alert-dismissible/alert-dismissible.json"
}
},
{
"title": "Alert: Information",
"slug": "alert-information",
"path": "snippets/alert-information/alert-information.json",
"code": "\n \n Information Body text starts on the same row as\n heading.\n \n",
"endpoints": {
"content": "snippets/alert-information/alert-information.json"
}
},
{
"title": "Alert: Negative",
"slug": "alert-negative-variant",
"path": "snippets/alert-negative-variant/alert-negative-variant.json",
"code": "\n \n Negative Error message requiring user attention.\n \n",
"endpoints": {
"content": "snippets/alert-negative-variant/alert-negative-variant.json"
}
},
{
"title": "Alert: Notice",
"slug": "alert-notice",
"path": "snippets/alert-notice/alert-notice.json",
"code": "\n \n Notice Body text with link or additional context.\n \n",
"endpoints": {
"content": "snippets/alert-notice/alert-notice.json"
}
},
{
"title": "Alert: Positive",
"slug": "alert-positive",
"path": "snippets/alert-positive/alert-positive.json",
"code": "\n\n Positive Feedback message with optional CTA.\n\n",
"endpoints": {
"content": "snippets/alert-positive/alert-positive.json"
}
},
{
"title": "Alert: UX text heading do",
"slug": "alert-ux-do",
"path": "snippets/alert-ux-do/alert-ux-do.json",
"code": "\n \n We were unable to show your e-invoices. Try again. If it still doesn't work, contact us\n \n",
"endpoints": {
"content": "snippets/alert-ux-do/alert-ux-do.json"
}
},
{
"title": "Alert: UX text heading don't",
"slug": "alert-ux-dont",
"path": "snippets/alert-ux-dont/alert-ux-dont.json",
"code": "\n \n We were unable to show your e-invoices.\n Try again. If it still doesn't work, contact us\n \n",
"endpoints": {
"content": "snippets/alert-ux-dont/alert-ux-dont.json"
}
},
{
"title": "Alert: UX with a button",
"slug": "alert-ux-with-a-button",
"path": "snippets/alert-ux-with-a-button/alert-ux-with-a-button.json",
"code": "\n \n Automated advice for this savings will stop on 9 September. To continue receiving placement advice, you need to change\n or confirm your answer.\n \n",
"endpoints": {
"content": "snippets/alert-ux-with-a-button/alert-ux-with-a-button.json"
}
},
{
"title": "Alert: UX with a link",
"slug": "alert-ux-withlink",
"path": "snippets/alert-ux-withlink/alert-ux-withlink.json",
"code": "\n \n \n Welcome to your new financial overview. We've made it easier to get a clear view of your finances. The old page will close in August. If you added any details yourself on the old page, like savings or debts, you'll need to add them again here. Go to the old overview\n \n \n",
"endpoints": {
"content": "snippets/alert-ux-withlink/alert-ux-withlink.json"
}
},
{
"title": "Alert: UX without heading",
"slug": "alert-ux-without-heading",
"path": "snippets/alert-ux-without-heading/alert-ux-without-heading.json",
"code": "\n \n Automated advice for this savings account was disabled on 9 July as the data was\n more than 24 months old.\n \n",
"endpoints": {
"content": "snippets/alert-ux-without-heading/alert-ux-without-heading.json"
}
},
{
"title": "Alert: Warning",
"slug": "alert-warning",
"path": "snippets/alert-warning/alert-warning.json",
"code": "\n\n Warning Important information to consider.\n\n",
"endpoints": {
"content": "snippets/alert-warning/alert-warning.json"
}
},
{
"title": "Avatar: Hero",
"slug": "avatar-hero",
"path": "snippets/avatar-hero/avatar-hero.json",
"code": " \n \n \n \n \n \n \n +5\n",
"endpoints": {
"content": "snippets/avatar-hero/avatar-hero.json"
}
},
{
"title": "Badge: Lead",
"slug": "badge-lead",
"path": "snippets/badge-lead/badge-lead.json",
"code": "\n \n \n Launched\n \n \n \n \n Overdue\n \n",
"endpoints": {
"content": "snippets/badge-lead/badge-lead.json"
}
},
{
"title": "Badge: Notification",
"slug": "badge-notification",
"path": "snippets/badge-notification/badge-notification.json",
"code": "\n \n 9\n 99+\n",
"endpoints": {
"content": "snippets/badge-notification/badge-notification.json"
}
},
{
"title": "Badge: Rounded",
"slug": "badge-rounded",
"path": "snippets/badge-rounded/badge-rounded.json",
"code": "\n 01 \n 02 \n 03 \n 04 \n 05 \n 06 \n",
"endpoints": {
"content": "snippets/badge-rounded/badge-rounded.json"
}
},
{
"title": "Badge: Size",
"slug": "badge-size",
"path": "snippets/badge-size/badge-size.json",
"code": "\n \n \n Information\n \n \n 280\n \n",
"endpoints": {
"content": "snippets/badge-size/badge-size.json"
}
},
{
"title": "Badge: Trail",
"slug": "badge-trail",
"path": "snippets/badge-trail/badge-trail.json",
"code": "\n \n 10,000.00\n \n \n \n 142.00\n \n \n",
"endpoints": {
"content": "snippets/badge-trail/badge-trail.json"
}
},
{
"title": "Badge: UX common EN",
"slug": "badge-ux-common-en",
"path": "snippets/badge-ux-common-en/badge-ux-common-en.json",
"code": "\n Signed\n Waiting for signature\n Waiting for other's signature\n Expired\n Closed\n Removed\n\n",
"endpoints": {
"content": "snippets/badge-ux-common-en/badge-ux-common-en.json"
}
},
{
"title": "Badge: UX common SV",
"slug": "badge-ux-common-sv",
"path": "snippets/badge-ux-common-sv/badge-ux-common-sv.json",
"code": "\n Signerat\n Väntar pa signatur\n Väntar pa annans signatur\n Förfallet\n Avslutad\n Borttaget\n",
"endpoints": {
"content": "snippets/badge-ux-common-sv/badge-ux-common-sv.json"
}
},
{
"title": "Badge: Variants",
"slug": "badge-variants",
"path": "snippets/badge-variants/badge-variants.json",
"code": "\n \n \n Information\n \n \n \n Notice\n \n \n \n Positive\n \n \n \n Warning\n \n \n \n Negative\n \n",
"endpoints": {
"content": "snippets/badge-variants/badge-variants.json"
}
},
{
"title": "Breadcrumbs: Mobile",
"slug": "breadcrumbs-mobile",
"path": "snippets/breadcrumbs-mobile/breadcrumbs-mobile.json",
"code": "\n \n \n Green\n \n \n \n Folder\n \n Current \n",
"endpoints": {
"content": "snippets/breadcrumbs-mobile/breadcrumbs-mobile.json"
}
},
{
"title": "Breadcrumbs: overflow",
"slug": "breadcrumbs-overflow",
"path": "snippets/breadcrumbs-overflow/breadcrumbs-overflow.json",
"code": "\n