Wire

UI

Pre-release documentation for v2. If you are looking for the v1 documentation.

Click here

Tailor the visual aesthetics of your WireUI components to your liking by customizing the default color scheme. This includes fine-tuning colors for various elements like Notifications, dialogs, inputs, selects, buttons, and more.

All it takes is extending the Tailwind Colors configuration within your tailwind.config.js file. By adding your preferred color choices, you can achieve a unique and cohesive look that aligns perfectly with your design preferences and branding.

1const colors = require('tailwindcss/colors')
2 
3module.exports = {
4 ...
5 theme: {
6 extend: {
7 colors: {
8 ...
9 primary: colors.indigo,
10 secondary: colors.gray,
11 positive: colors.emerald,
12 negative: colors.red,
13 warning: colors.amber,
14 info: colors.blue
15 },
16 },
17 },
18 ...
19}