FAO Design System 3

Use FAO design language to create simple, intuitive and beautiful experiences.

What's new Download

About

The FAO web Design System is an essential resource for all Content Owners seeking to create world-class online experiences.

This system provides a robust framework that enables users to develop simple, intuitive, elegant, aesthetically pleasing and user-friendly digital interfaces. The system's components have undergone rigorous testing, ensuring their compatibility with over 30 screen sizes, orientations, and language combinations.

As a result, users can expect a fully adaptive digital experience that delivers a harmonized User eXperience (UX) across FAO.org. In addition, the system's components are designed to work seamlessly with one another, allowing users to build a cohesive online presence that is consistent with the FAO brand.

Install via package manager

Install FAO Design System CSS files via npm.

Package managed installs don't include documentation or our full build scripts.

npm install fao-design-system
            
        

What's new?

Dark Mode

Dark mode reduces eye strain when reading at night or in ambient conditions.

Learn more
Dark Mode

Audio Visual

Use the FAO Design System audio visual template to create beautiful pages

Learn more
Audio Visual