These Docs are for Ripple version 2.0. If you are looking for the original Ripple Storybook please click below
View Ripple 1 storybook
Ripple Design System

Ripple Design System

Ripple is the design system for Victorian government digital products

Getting Started

Find out more

Using Ripple in SDP sites

{
  "message": "You should use slots with <ContentRenderer>",
  "value": {
    "_path": "/",
    "_dir": "",
    "_draft": false,
    "_partial": false,
    "_locale": "",
    "title": "Ripple Design System",
    "description": "Ripple is the design system for Victorian government digital products",
    "icon": "carbon:home",
    "layout": "home",
    "primaryCTA": {
      "title": "For Designers",
      "description": "Information for designers using Ripple to create brand Victoria compliant digital experiences.",
      "image": {
        "src": "/assets/img/for-designers.png"
      },
      "url": "/design-system/design/getting-started"
    },
    "secondaryCTA": {
      "title": "For Developers",
      "description": "How to get started implementing Ripple UI components in digital products.",
      "image": {
        "src": "/assets/img/for-developers.png"
      },
      "url": "/design-system/develop/getting-started"
    },
    "modulesCTA": {
      "title": "Modules",
      "description": "Paragraph Default. Cards contain actionable content about a single topic. These are usually grouped as similar style sets.",
      "url": "/framework"
    },
    "quickLink1": {
      "title": "About Ripple",
      "description": "Ripple is a system of reusable styles, components, patterns and tools for creating Victorian government digital experiences.",
      "url": "/design-system/about/what-is-ripple"
    },
    "quickLink2": {
      "title": "Who should use it",
      "description": "Ripple is built by government for government to deliver services Victorians trust and rely on.",
      "url": "/design-system/about/whos-it-for"
    },
    "quickLink3": {
      "title": "Design principles",
      "description": "The guiding principles that are the foundation of the Ripple Design System.",
      "url": "/design-system/design/our-design-principles"
    },
    "framework": {
      "title": "Ripple framework",
      "description": "Ripple framework contains the tools for building SDP sites using Ripple design system components.",
      "url": "/framework"
    },
    "body": {
      "type": "root",
      "children": [],
      "toc": {
        "title": "",
        "searchDepth": 2,
        "depth": 2,
        "links": []
      }
    },
    "_type": "markdown",
    "_id": "content:1.index.md",
    "_source": "content",
    "_file": "1.index.md",
    "_extension": "md"
  },
  "excerpt": false,
  "tag": "DocsContent"
}