Your First Tutorial
Create your first UI component with step-by-step guidance on building, testing, and deploying UI elements.
Interactive Example
Getting Started
Use our component library to build a custom button with hover effects.
- 1. Add the button component
- 2. Configure your CSS properties
- 3. Test interactivity
Code Example
HTML Markup
<import>@eseniiaia/buttons</import>
<button
class="es-btn-primary"
size="medium"
variant="outlined"
>
Click Me
</button>
CSS (Optional)
.es-btn-primary {
@apply bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded-md;
}
.es-btn-primary:disabled {
@apply opacity-50;
}
Try It Yourself
Live Demo
Best Practices
Responsive Design
Ensure your component scales across devices.
See Documentation →
Accessibility
Follow ARIA standards for inclusive design.
Guidelines →
Performance
Optimize loading with lazy loading techniques.
Tools →