open-index/open-npm huggingface dataset:
npm package: @franmore/tailwind-shadow-utilities
Description: Tailwind CSS plugin to add shadow utilities to your website
Author: Franmore
Latest version: 0.0.2

# Tailwind Shadow Utilities

A powerful Tailwind CSS plugin that provides a comprehensive set of directional shadow utilities for your website. This plugin allows you to easily add shadows in specific directions (X-axis, Y-axis, right, left, top, bottom) with various sizes.

## Installation

```bash
npm install @franmore/tailwind-shadow-utilities
```

## Usage

1. Add the plugin to your `globals.css file`:

```
  @import 'tailwindcss';
  @plugin '@franmore/tailwind-shadow-utilities';
  
```

2. Use the utilities in your HTML:

```html
<div class="shadow-x-md"><!-- Horizontal shadow --></div>
<div class="shadow-y-lg"><!-- Vertical shadow --></div>
<div class="shadow-r-xl"><!-- Right shadow --></div>
<div class="shadow-l-2xl"><!-- Left shadow --></div>
<div class="shadow-t-sm"><!-- Top shadow --></div>
<div class="shadow-b-3xl"><!-- Bottom shadow --></div>
```

## Available Utilities

### Shadow Sizes
- `2xs`: Smallest shadow
- `xs`: Extra small shadow
- `sm`: Small shadow
- `md`: Medium shadow
- `lg`: Large shadow
- `xl`: Extra large shadow
- `2xl`: Double extra large shadow
- `3xl`: Triple extra large shadow

### Shadow Directions
- `shadow-x-{size}`: Horizontal shadow (X-axis)
- `shadow-y-{size}`: Vertical shadow (Y-axis)
- `shadow-r-{size}`: Right shadow
- `shadow-l-{size}`: Left shadow
- `shadow-t-{size}`: Top shadow
- `shadow-b-{size}`: Bottom shadow

## Examples

```html
<!-- Subtle horizontal shadow -->
<div class="shadow-x-sm">
  Subtle horizontal shadow
</div>

<!-- Strong vertical shadow -->
<div class="shadow-y-xl">
  Strong vertical shadow
</div>

<!-- Large right-side shadow -->
<div class="shadow-r-lg">
  Large right shadow
</div>
```

## Browser Support

This plugin works in all modern browsers that support CSS box-shadow.

## Requirements

- Tailwind CSS v3.0.0 or higher

## License

MIT

## Author

Created by Franmore - An 11-year-old developer passionate about web development! 🚀

## Contributing

Contributions are welcome! Please feel free to submit a Pull Request.