Colors
Ayro UI Colors
All the colors are available as CSS variables in starter.css file, we predefinded all required colors so you will remain consistent while building a project using Ayro UI. You can also explore all these colors from our core style guide which is provided as a figma file.
Color Codes
--primary: #155bd5;--primary-dark: #1c3ab6;--primary-light: #e2f1ff;--accent: #00d4d7;--accent-dark: #00bac1;--accent-light: #dff9f8;--success: #13d527;--success-dark: #00ae11;--success-light: #eafbe7;--secondary: #8f15d5;--secondary-dark: #6013c7;--secondary-light: #f4e5fa;--info: #15b2d5;--info-dark: #0f8ca8;--info-light: #e0f5fa;--caution: #dbbb25;--caution-dark: #d58f15;--caution-light: #fbf9e4;--error: #e6185e;--error-dark: #bf1257;--error-light: #fce4eb;--black: #1d1d1d;--dark-1: #2d2d2d;--dark-2: #4d4d4d;--dark-3: #6d6d6d;--gray-1: #8d8d8d;--gray-2: #adadad;--gray-3: #cdcdcd;--gray-4: #e0e0e0;--light-1: #efefef;--light-2: #f5f5f5;--light-3: #fafafa;