Stay up to Date
|Message streams||Documentation||In progress|
|Nectar landing page||Documentation||In progress|
Guidelines for designing and using the EmptyState component in the web app
Reference these docs for proper usage of "my" and "your" for in-app copy
We now offer documentation on how to format dates and times across our products.
The collapsible component is a utility for creating regions of content that can expand/collapse with a simple animation.
Numeral is a primitive component used to format numbers according to our number formatting guidelines.
The Checkbox and Radio components now have a prop to add a text label.
You can now explore and track existing, new and proposed Racine components in Seeds.
Drawer component is now available
Tooltip component is now available
Popout component is now available
Documentation for creaging message feeds app wide
Documentation for creating consistent message feeds app wide.
- April 16, 2019
Racine components in Seeds
Seeds is now the new home for Racine components, the reusable building blocks for Sprout products.
The new components landing page lets you dive into our component library, with links to a getting started guide and a search feature for all of our components.
The Box component is a new, low-level primitive for building user interfaces. Learn how to take advantage of this new tool by reading its documentation in Seeds.
Onboarding helps users discover, understand, and use the value that Sprout provides as quickly as possible. Now you can learn how to build an onboarding experience of your own in Sprout apps.
Illustration is used to tell a story, convey a mood, or utilize metaphor to make a complex idea clear and concise. New guidelines make sure your illustrations are as effective and on-brand as possible.
- January 8, 2019
Improvements to Border, Elevation, and Space
It's now easier than ever to understand how to use core styles like border, elevation, and space in your work.
We took the time to freshen up the Border page to make it easier to understand which values to use for border widths and border radii.
The product design team used Nectar as an opportunity to re-evaluate our elevation principles, and we've put together a new page so that you can use our new guidelines today.
The Motion documentation has been updated with new values for easing and duration, new interactive visualizations, and new brand guidelines.
How the brand and marketing teams make complex numerical data clear and concise.
Learn the techniques and specifications the video team uses to create compelling live action videos.
- November 15, 2018
Design token documentation
Take advantage of Seeds' core styles in your code, no matter that technologies you use.
Learn how to install Seeds packages into your project, and see what files are available for each package.
We've added animation documentation for actionable icons!
The accessibility guidelines have been updated to reflect the evolution of the practice at Sprout.
We now have documentation on how to add "sparkle" to your designs!
Entries in the changelog can now be linked to individually.
The hero image now has a nice animation.
- October 3, 2018
New brand assets and changelog pages
Easily find and download the assets you need to express Sprout's brand, and discover what's changing on Seeds with these updates.
You can express Sprout's brand in your work more accurately by using our official logo, colors, and imagery. The new brand assets page is your one stop shop for all of these.