Stroke
@include('_partials.class-table', [ 'rows' => [ [ '.stroke-current', 'stroke: currentColor;', 'Set the stroke color to the current text color.', ], ] ])
Usage
Use .stroke-current to set the stroke color of an SVG to the current text color. This makes it easy to set an element's stroke color by combining this class with an existing text color utility.
Useful for styling icon sets like Feather that are drawn entirely with strokes.
@component('_partials.code-sample', ['class' => 'text-center'])
@endcomponentCustomizing
Control which stroke utilities Tailwind generates by customizing the theme.stroke section in your tailwind.config.js file:
@component('_partials.customized-config', ['key' => 'theme'])
- stroke: {
- current: 'currentColor',
- }
- stroke: theme => ({
- 'red': theme('colors.red.500'),
- 'green': theme('colors.green.500'),
- 'blue': theme('colors.blue.500'),
- }) @endcomponent
@include('_partials.variants-and-disabling', [ 'utility' => [ 'name' => 'stroke', 'property' => 'stroke', ], 'variants' => ['responsive'], ])
