CSS Utility Classes Color

Inkline uses a beautiful, consistent color scheme across the framework.

In Inkline, color utility classes provide an easy way to apply predefined backgrounds and text colors to various elements throughout your application. These utility classes are based on the color values defined in your Inkline configuration file, allowing you to maintain a consistent color scheme across your project.

  • _background:${color}
  • _background:${color}-{lightness}
  • _background:${color}-tint-{lightness}
  • _background:${color}-shade-{lightness}
  • _text:${color}

Brand Colors

Brand color utilities in Inkline allow you to apply your application's distinctive brand colors to various elements. You can easily apply primary and secondary brand colors as text or background colors.

Brand utility classes make it simple to maintain a consistent brand identity across your project, ensuring that your design system stays cohesive and visually appealing.

State Colors

State color utilities are designed to represent different states or statuses within your application. These colors include success, info, warning, and danger.

State color utilities help convey important information to users, such as the success of an action or the presence of an error, making your application more intuitive and user-friendly.

Basic Colors

Basic color utilities cover a range of standard colors such as red, blue, green, yellow, and more. These utilities allow you to apply general-purpose colors to your application elements.

Basic color utilities provide flexibility in your design system, enabling you to create visually engaging interfaces without compromising consistency.

Neutral Colors

Neutral color utilities in Inkline offer a selection of grayscale colors, ranging from white to black. These utilities are ideal for creating subtle contrasts, establishing hierarchy, and ensuring readability in your application.

Neutral color utilities help maintain a clean and professional appearance, making your application visually appealing and easy to navigate.