<Tabs aria-label="Tabs with underline" variant="underline">
<Tabs.Item active title="Profile" icon={HiUserCircle}>
This is <span className="font-medium text-gray-800 dark:text-white">Profile tab's associated content</span>.
Clicking another tab will toggle the visibility of this one for the next. The tab JavaScript swaps classes to
control the content visibility and styling.
</Tabs.Item>
<Tabs.Item title="Dashboard" icon={MdDashboard}>
This is <span className="font-medium text-gray-800 dark:text-white">Dashboard tab's associated content</span>.
Clicking another tab will toggle the visibility of this one for the next. The tab JavaScript swaps classes to
control the content visibility and styling.
</Tabs.Item>
<Tabs.Item title="Settings" icon={HiAdjustments}>
This is <span className="font-medium text-gray-800 dark:text-white">Settings tab's associated content</span>.
Clicking another tab will toggle the visibility of this one for the next. The tab JavaScript swaps classes to
control the content visibility and styling.
</Tabs.Item>
<Tabs.Item title="Contacts" icon={HiClipboardList}>
This is <span className="font-medium text-gray-800 dark:text-white">Contacts tab's associated content</span>.
Clicking another tab will toggle the visibility of this one for the next. The tab JavaScript swaps classes to
control the content visibility and styling.
</Tabs.Item>
</Tabs>
I want to change base style of icons, text next to them and outline, when clicked from blue to #80143c
Also interested in how can I change other colors, cause classname doesn’t work here
here’s how it looks like now
-tried to change color with a classname(had no effect, also tried class)
-tried to do it through root(crash)
-tried inner color property(no effect again)