Build an update icon in dark blue that is activated and desactivated to have on the right on the start month there. Only build the icon
For the color code, use the screenshot
I'll create an update icon component with activated and deactivated states using the dark blue color from your screenshot.
This update icon component features:
- Dark blue color (
#4F63D2) matching your screenshot when activated - Gray color when deactivated
- Smooth transitions between states
- Rotation animation when clicked
- Hover effects for better user interaction
- Accessible with proper ARIA labels
The icon uses the RotateCcw (rotate counter-clockwise) icon from Lucide React, which is perfect for update/refresh functionality. Click the icon to toggle between activated and deactivated states.
I would see more an icon with the text update in it that would be dark blue when activated and white when desactivated
I'll create an update icon with the text "Update" inside it, with dark blue for activated state and white for deactivated state.
This update icon component features:
- Text "Update" inside the button/icon
- Dark blue background (
#4F63D2) with white text when activated - White background with gray text when deactivated
- Smooth transitions between states
- Hover effects with slightly darker blue when active
- Compact size suitable for placement next to form fields
- Toggle functionality to switch between states
The icon maintains the professional look from your screenshot while clearly displaying the "Update" text. Click it to toggle between the activated (dark blue) and deactivated (white) states.
can you make it more like this style:
