We value your feedback!

Can you spare a moment to take our survey?
Your feedback helps us improve Lucide and make it better for everyone.

Skip to content
Get React certificates from certificates.dev

Global Styling

Adjusting icons can be done by using color, size and stroke width. To style all icons globally, you can use a context provider.

Context Provider

For global styling using a context provider, you can use the LucideProvider component that is provided by the lucide-react-native package.

tsx
import { LucideProvider, Home } from 'lucide-react-native';

const App = () => (
  <LucideProvider
    color="red"
    size={48}
    strokeWidth={2}
  >
    <Home />
  </LucideProvider>
);

This will apply the color, size and strokeWidth props to all icons that are children of the LucideProvider.