Design, simply elegant.

The E*TRADE Design Language is a design system that provides a seamless experience from end to end.

June 14th release (2019.6.14)
Bitbucket git repo Styles Material icons now have a xxs size (20px)
Bitbucket git repo Styles Repo refactor: removed most grunt task in favor of npm
Bitbucket git repo Styles Repo refactor: remove material icons as dependency
Bitbucket git repo Styles Add the flex grow option to the flex columns
Bitbucket git repo Styles Updated browser font rendering to align with Graphik
Bitbucket git repo Styles Updated the spinner so IE browser show purple instead of green
Bitbucket git repo Styles Added the table caption bottom helper class .caption-bottom
Bitbucket git repo Styles Updated the color of the dropdown to align with our new purple
Tabs etrade.design Add clearer guidance on etrade.design for our responsive overflow tab
Mobile device etrade.design Fix a scroll issue with the etrade.design mobile menu
May 31st realease (2019.5.31)
Bitbucket Styles We added a minified CSS file to improve load performance.
Bitbucket Styles The `accent-color-` variable is now available to use globally.
Bitbucket Styles We now have breakpoint specific screen-reader-only helper classes. These classes are used to visually hide elements, while still leaving them accessible to screen readers. The new classes are .sr-only-sm, .sr-only-md, and .sr-only-lg.
Bitbucket Styles On the stacked tables, the padding below the labels has been removed.
Bitbucket Styles We updated swipe-able cards. There was a bug on Firefox that prevented the swipe from scrolling smoothly.
Bitbucket Styles We updated the universal messages CTA. The CTA now aligns to the right no matter how much copy there is. It also fixes alignment issues when using the a tag instead of the button tag.
Layout Documentation (etrade.design) We update guidance on the Grid Breakpoints Mixins to match the current Design Language standard.
Tables Documentation (etrade.design) We now have documentation on Table Captions usage.
Form elements Documentation (etrade.design) We now have documentation on Fieldset usage.
Colors Documentation (etrade.design) We added the .body-text-color helper class to the colors page.
Toasts Documentation (etrade.design) Fixed a bug with the Toasts and File Upload where the click event was disabled.
Colors Documentation (etrade.design) Updated the colors to match the latest updates in the Design Language styles. $label-color is now #444444 and $body-text-color is now #242424. We removed the $header-text-color, since that and $body-text-color are both the same.
Changelog Documentation (etrade.design) We added Deep-linking to the changelog. This will allow us to search the log faster.