One data grid for JavaScript, React, Vue & Angular. Sorting, filtering, virtualization, pinning, and CSV export included. Early access $199 $349 → [Get it now]

How to build a design system in React

Building a design system in React is about more than just a component library; it is about creating a single source of truth for your UI logic and visual identity. With over 25 years of experience in software development and as the creator of CoreUI, I’ve architected dozens of design systems that power enterprise-level applications. The most efficient approach involves using design tokens for constants, the React Context API for theming, and a component-driven architecture to ensure modularity. By following these principles, you can create a robust system that improves both developer velocity and design consistency across your organization.

Read More…

How to theme Angular Material components

Creating branded Angular applications requires customizing Material Design components to match your company’s color palette and design system. With over 12 years of Angular experience since 2014 and as the creator of CoreUI, I’ve implemented custom themes for numerous enterprise applications. Angular Material provides a comprehensive theming system based on SCSS that allows you to define primary, accent, and warn color palettes. The approach involves creating a custom theme file and importing it into your application’s main stylesheet.

Read More…

How to create a theme switcher in Vue

Theme switchers enable users to customize application appearance with multiple color schemes, enhancing personalization and brand flexibility. As the creator of CoreUI, a widely used open-source UI library, I’ve built theme switchers for enterprise Vue applications throughout my 11 years of frontend development. The most versatile approach is managing theme state reactively and applying theme-specific CSS custom properties. This method supports unlimited themes, smooth transitions, and maintains persistent user preferences across sessions.

Read More…

How to implement dark mode in Vue

Dark mode improves user experience by reducing eye strain in low-light environments and has become an essential feature for modern web applications. As the creator of CoreUI, a widely used open-source UI library, I’ve implemented dark mode in Vue applications throughout my 11 years of frontend development. The most effective approach is using Vue 3 Composition API with reactive state and CSS custom properties for theme switching. This method enables smooth theme transitions, persists user preferences, and maintains clean separation between logic and styling.

Read More…