Opacity: 100%
Explore the opacity-100 utility and see how it controls element transparency.
Opacity Preview
opacity-100
This element has 100% opacity
Class: opacity-100
CSS: opacity: 1.00
Value: 100%
Compare with Other Opacity Values
0%
opacity-025%
opacity-2550%
opacity-5075%
opacity-75100%
opacity-100Usage Examples
Overlays & Modals
25% overlay
Content
With overlay
50% overlay
Content
With overlay
Hover Effects
Layering
Multiple layers with different opacity
Interactive Opacity Demo
Customize Element
0%25%50%75%100%
Preview
Custom Element
100% opacity
Classes: from-blue-500 to-purple-600 rounded-lg
Opacity: 100%
CSS: opacity: 1.00