HPU Shield Logo Teal

HPUCSS

A mobile-first fully responsive consolidated CSS and JS framework developed for Hawaiʻi Pacific University.

Release v3.0

HPUCSS CDN

Simply include the <link> CDN inside the <head> tag, and the <script> CDN right before the ending </body> tag. For more ways to use the framework, please refer to Getting Started guides.

Minified CSS CDN:


<link href="https://webdev.hpu.edu/css/hpu.min.css" rel="stylesheet" integrity="sha384-efToe+nnkr9YjvoiqS0oqGwQlwn3FIRc5Tsx1FDnb7swIIan4OoVjcwzw5fxJEIm" crossorigin="anonymous">

Minified JS CDN:


<script src="https://webdev.hpu.edu/js/hpu.min.js" integrity="sha384-RBeZDDVlK4JK+ub8Axl0Gr/skF5v+2NWrzLxctB5fT5bRn7fbEWipXyy9z2Qwp4O" crossorigin="anonymous"></script>

Reasons to Use HPUCSS

Brand Compliance Built-In

Every module in this CSS framework is pre-designed to match HPU’s brand standards, from colors and typography to font styles and beyond.

Web Accessibility First

Every module is crafted with accessibility at its core, from color contrast and semantic markup to keyboard navigation, ensuring your site is usable and welcoming to everyone.

Speeds Up Development

With default behaviors built in, modules work right out of the box. And when customization is needed, a clear, universal format makes applying options fast and intuitive.


Example Showcases

ATM from Afar

HPU Main Homepage Mockup

CMDR DFG

CNCS CMDR

CMDR DFG

College Homepage