Recent Releases

For each Design System release we’ll record release notes here. Ask questions, express concerns and make requests in the #hudl-design-system Slack channel.


June 30, 2017 - Avatars

This release defines Avatars in Uniform. The design guidelines are appropriate for all platforms.

A React component for Avatars is available. A React Native version of this component is coming soon. Documentation of the CSS is available in the UI CSS library.


This release defines Links and Content Selection in Uniform.

Links are only implemented (and only appropriate) in Uniform UI for Web. Classes are available in the Uniform UI CSS library. A Link React component is available in the Uniform UI Components.

Content Selection is design guidelines applicable for all platforms. The color values for Select Background, Select Edge and Select Outline are available for web, iOS, Android and React Native. The Select Mark icon is available in Sketch.

Also in this release are 3 new icons: User, User Add, and User Groups. Each comes in a filled and outlined variant. These new icons are available in the Uniform Icons Sketch file and as React components.


March 27, 2017 - Color, v2

This is fairly large release that has been in the works since last year. See: Color.

It takes the initial work we did in creating the Uniform Colors and completes a large refactor based on a lot of feedback we got from designers after they attempted to use those initial colors in their UIs.

All of these new colors are implemented in our Uniform UI libraries as variables for use in your interfaces. Note that this release comes with a lot of deprecations, so be sure to keep an eye on your variable naming.

For Uniform UI for Web, we have v0.11.0 of uniform-ui-css. It is documented in the Uniform UI Docs, and pay special attention to the deprecation guide since, as mentioned, there are a lot of variable deprecations. In addition, for the Web we have v2.4.0 of uniform-ui-components which provide a Level and Environment component. For Uniform UI for Android, we have v0.3.0 of the Android Framework. For Uniform UI for iOS, we have v1.1.0 of ios-uniform-ui.

And lastly, we now have Uniform UI for React Native. This is a new library, and the initial release of v1.0.0 contains these new color variables for use in your React Native project.

There is also an updated “Uniform Color Swatches” Sketch file in the Assets repo.


October 27, 2016 - Space

This release defines spacing in Uniform. It includes guidelines for using space and a space scale. See: Space

Implementation for space on the web is documented in Uniform UI for space classes, space mixin and space variable.

Also in this release are 17 new icons along with their outlined counterpart. These new icons are available in the Uniform Icons Sketch file and as React components.


September 30, 2016 - Forms

This release defines base HTML Forms in Uniform — specifically Text Inputs, Text Areas, Selects, Radios, Checkboxes, and their various styles, sizes, options, and states. See: Forms

These Button definitions are implemented in Uniform UI CSS v0.9.0, along with Uniform UI Components v1.1.0 for use in web interfaces.


September 20, 2016 - Added New Wallpapers

With the recently announced brand refresh, we wanted to make some wallpapers available for use on your desktops and phones so you can show off this new Hudl style. You can find them in Downloads.


September 9, 2016 - Brand Logos and Guidelines

The Brand page was updated to list the official Hudl logos in use, and the guidelines for using them. There are also links to the respective logo assets to be used in marketing materials. See: Brand.


August 26, 2016 - Iconography and Buttons

With the definition of Iconography, this release completes the “Big Three” stylistic tenants of our design language (color, typography, iconography). See: Iconography.

This release also defines Buttons. See: Buttons. These Button definitions are implemented in Uniform UI CSS v0.8.0 for use in web interfaces.

Uniform UI Components are now a thing! Both Icons and Buttons are now available as React components.

The information architecture of this website (design.hudl.com) has been updated to keep our growing design language organized. With the addition of Buttons, Identity Color and Tagging Color are now categorized as “Elements”.


July 22, 2016 - Typography

This release defines Typography in Uniform. Specifically style guidelines for Headings, Subheads, Text, Item Titles. See: Typography. Also included is a Typography Sketch asset added to downloads.

These definitions are implemented in Uniform UI CSS v0.7.0 for use in web interfaces.


June 29, 2016 - Identity and Tagging Colors

This release defines Identity Colors (Teams, Team Members, Athletes, and Brands) and Tagging Colors in Uniform. See: Identity Color and Tagging Color.

These definitions are implemented in Uniform UI CSS v0.5.0 for use in web interfaces.


June 7, 2016 - Colors for Dividers and Borders

After releasing Colors, we immediately realized we needed variations for hairlines and borders. This release defines Tints and Shades of background colors to address this. See Color. More about this on Sync.

These definitions are implemented in Uniform UI CSS v0.3.1 for use in web interfaces.


May 18, 2016 - Colors

This release defines Colors in Uniform. See: Color. There are 31 color swatches in four categories (Base Brand, Utility, Light Environment and Dark Environment) along with guidelines for when to use each color. More about this on Sync.

These definitions are implemented in Uniform UI CSS v0.3.0 for use in web interfaces.


April 22, 2016 - Hello world!

What’s new? Everything! This is the beta launch of Hudl’s Design System. The purpose of this release is to set the stage for what’s to come.

Included in this release:

This site is built using Jekyll and hosted on GitHub Pages.