I have an app that I started developing recently and I'm considering moving over to react-rainbow. Is there a way to set a color theme for all react-rainbow components?
First, you have to create an object with the customizations you want to add, then you import Application from react-rainbow-components and wrap your components with Application. Finally, you pass your customizations object as the prop theme to Application. This is an example.
import React from 'react';
import { Application, Button } from 'react-rainbow-components';
const theme = {
rainbow: {
palette: {
brand: '#5c56b6',
},
},
};
<Application theme={theme} className="rainbow-p-vertical_xx-large rainbow-align-content_center">
<Button
label="Button Brand"
onClick={() => alert('clicked!')}
variant="brand"
/>
</Application>