Explore UAB

Colleges & Schools

Dragon Scale Design System Joomla 4 Version

Dragon Scale Design System

Welcome to UAB’s scalable system of design components for building unified and accessible digital interfaces.

Getting started

Getting started

As with any endeavor, it’s important to start with the basics before diving into the Dragon Scale Design System. You should first learn Joomla, the template positions, and understand our transition to Joomla 4. Additionally, you should explore the example pages for inspiration as you build your own different types of pages.

Learn the Basics Read the Frequently Asked Questions Discover the Template Positions Find Inspiration from Example Pages
Building your website

Building your website

The Dragon Scale Design System provides you with all of the pieces you need to construct a clean, user-friendly, accessible and branded site, regardless of your school or unit. Browse our design features, templates and page components to see how they can be combined

Template elements

Template elements that are designed to be on almost all (if not all) pages of your site. Learn More

Components

Components are the heart of the design system and offer a variety of ways to display different types of content. Learn More

Design basics

Design basics are elements that are used in other components or can be separately. Learn More
Using Adobe XD

Using Adobe XD

The Dragon Scale Design System includes both the tools on this page and a customized Adobe XD file. The Dragon Scale XD file can be used to build mockups so that you can preview designs with stakeholders before starting development. This saves time and ensures that content and design components are aligned.