Victoria UI Kit

GitHub stable release Codeship Status for victoriauniversity/vic-ui-kit

ChangelogProject at GitHubReleases/Download

Victoria UI Kit is a style guide and UI pattern library providing base CSS, JavaScript and HTML markup required to build websites and applications affiliated with Victoria University of Wellington.

By building new web projects on top of this library, developers can quickly reuse out of the box layouts and UI components, gaining following advantages:

Quick Start

To include Victoria's UI styles in your project, copy-paste the following code snippet into the <head> element in your project:

<link rel="stylesheet" type="text/css" href="">

If you wish to use complex dynamic components that require JavaScript to work properly (see Components), include jQuery and Victoria's UI Scripts library just before the closing </body> tag:

<script src="" integrity="sha384-3ceskX3iaEnIogmQchP8opvBy3Mi7Ce34nWjpBIwVTHfGYWQS9jwHDVRnpKKHJg7" crossorigin="anonymous"></script>
<script src=""></script>

It is recommend to hotlink the libraries from CDN as shown above. However, if you wish to bundle them with your project, you can Download any given release or even use a package manager, such as NPM or Yarn:

yarn add --save

Next Steps

If you plan to build new application and override or extend Victoria UI's code base, it is highly recommended to understand and follow basic architectural principles first. In that case, start by reading through Architecture & Layout.

In case you are only maintaining already built application based on Victoria UI, explore all available Components and see how they can be best used in Examples.

If your web application extends Victoria UI code base and adds new components or alters existing ones, you need to follow its documentation to learn about all the differences.

How to contribute

Even though the Victoria UI library is mostly maintained by the Web Team, any form of contribution is highly appreciated.

To report a bug, request a feature or simply discuss your ideas, please either:

Support and contact

For any urgent inquiries, contact Nathan Irwin or other members of the Web Team.