Skip to main content

Q: What's Bolt?

A: Bolt is a design system consisting of visual style and UI components that are more consistent, made at a higher quality, and will be more efficiently applied to all future UI development.

Q: Why should I use Bolt?

A: You should use Bolt to build member-facing applications to rapidly and efficiently align them with brand standards, especially when working alongside the User Experience team.

Q: What's new in Bolt?

A: The latest version of Bolt is a completely new architecture built from the ground up on the latest technologies. Previous versions of Bolt have been built on a foundation of Bootstrap. As of version 3 Bolt is no longer using Bootstrap as a dependency. All the CSS and HTML have been built specifically in support of Bolt.

Q: Who is Bolt for?

A: Bolt is primarily for teams and vendors building member-facing web applications. We are always interested in hearing different use cases and how Bolt might solve unique situations.

Q: What about everyone else?

A: Teams building applications that are for internal use are encouraged to use the TSB-approved front-end framework of their choice, such as Material, Bootstrap, or Foundation with the help of a Bolt Adapter project to make these applications brand-adjacent. Each framework has its own pros and cons, and each team has its own experience and preferences. Ultimately, using ANY framework is better than using no framework, and for internal applications, teams should use what will make them productive.

Q: What's a Bolt Adapter?

A: A Bolt Adapter is a theme for an off-the-shelf front-end framework that uses Bolt's tokens to make the application appear brand-adjacent: not necessarily fully on brand, but using enough Nationwide color and typography choices to make them appear familiar to users.

Q: What's happening to previous versions of Bolt?

A: Bolt v2 will continue to be available, but we encourage member-facing applications to migrate to the newest version of Bolt when doing major changes, and for other applications to migrate toward another front-end framework of their choice with the help of a Bolt Adapter.

Display settings

Note: not all settings persist across pages

Default Compact (-1) Sparse (+1) XL (default) 2XL 3XL Default Min Max Light (default) System Dark Branded (default) Unbranded