Component Showcase

All Hard Hat Unicorns UI components following our brand guidelines

Buttons

This is a simple card with default padding and hover effects.

Using compound components

This card demonstrates the use of compound components for better structure.

This card does not have hover effects.

Basic Input

This is a helper text

Required Input*

Input with Error

Please enter a valid email address

Disabled Input

Input with Left Icon

Input with Right Icon

Message

Maximum 500 characters

Description with Error

Description is required

Mint

Violet

Grey

Red

Orange

Yellow

Green

Blue

Purple

Blue Light

Brown Light

Yellow Light

Green Light