NowSecure | Web Style Guide

Version 1.2.0

Last updated February 19, 2016


These guidelines are for anyone working on NowSecure websites or web applications. They make it easy to build interfaces that match our brand’s look and feel.

You can follow the releases on GitHub to stay up to date on all version changes.

Features:

  • Fully documented HTML, JADE, SCSS and CSS
  • No dependencies; simply link to the compiled CSS and run in your browser
  • Automatic generation of flexible, responsive UI components
  • Easy access for designers, developers, managers, and users
  • Rapid development of projects by allowing developers to find the correct CSS and HTML for any given UI component
  • Open sourced so that all great ideas can be included

Usage

To get started, link to the CSS file below in the layout's head tag. If possible, remove the http: prefix to avoid secure vs. nonsecure pages.

http://ux.nowsecure.com/css/styles.css

Do not save this file into your project; use the absolute path provided above so that your design stays in sync with the style guide project. And that's it! Then, you can choose any component you'd like to use by copying and pasting the code for it into your project.

Important note: Any other stylesheets in your project should be included -after- the link to the style guide stylesheet. That way, you can override any styles from the style guide that are specific to your project. Be careful not to change anything brand related, project specific stylesheets should mostly be page specific layout.

Browser Matrix

The data below represents the browsers we work to support and thouroughly test against for each product.

ChromeFirefoxIEEdgeSafariiOS SafariAndroid BrowserChrome Android
4844111399.24747
474310 8.44.4.4
46
Consistent TestingTesting Varies