# Glassmorphism Login Form

*Created by [Aigars Silkalns](https://github.com/puikinsh/) for [Colorlib](https://colorlib.com)*

![Glassmorphism Login Form Preview](../../assets/screenshots/glassmorphism.png)

A modern login form featuring the popular glassmorphism design trend with frosted glass effects and smooth animations.

## Features

- **Glassmorphism Design**: Frosted glass effect with backdrop blur
- **Gradient Background**: Beautiful purple-to-cyan gradient
- **Floating Labels**: Smooth label animations on focus
- **Password Toggle**: Eye icon to show/hide password
- **Social Login**: Google and GitHub integration ready
- **Form Validation**: Real-time validation with smooth error animations
- **Responsive**: Works on all screen sizes

## Files

- `index.html` - Main form HTML structure
- `style.css` - Complete self-contained CSS with glassmorphism styles
- `script.js` - Form functionality and interactions

## Dependencies

- `../../shared/js/form-utils.js` - Shared form utilities (validation, animations)

## Usage

1. Copy the entire `glassmorphism/` folder to your project
2. The form is completely self-contained with all CSS included
3. Only dependency is the shared JavaScript utilities
4. Customize colors by modifying the CSS variables in `style.css`
5. Integrate with your authentication system

## Customization

Key CSS variables to customize:
- `--primary-color`: Main theme color
- `--accent-color`: Accent color for focus states
- `--glass-bg`: Glass background opacity
- `--glass-border`: Glass border color

## Browser Support

- Chrome 88+
- Firefox 103+ 
- Safari 15.4+
- Edge 88+

Requires support for `backdrop-filter` CSS property.

## Credits

Created by [Aigars Silkalns](https://github.com/puikinsh/) for [Colorlib](https://colorlib.com).