Introduction
Get started with EletroDS Vue 3, the modern design system for Mercado Eletrônico built with Vue 3 and Tailwind CSS.
What is EletroDS?
EletroDS is a comprehensive design system that provides a unified set of design principles, components, and guidelines to ensure consistency and efficiency across all Mercado Eletrônico digital products.
Vue 3 Composition API
Built with Vue 3 and TypeScript for better type safety, performance, and developer experience with modern reactive patterns.
Tailwind CSS Integration
Utilizes Tailwind CSS for consistent styling, easy customization, and rapid development with utility-first approach.
Interactive Documentation
Live examples with real components, comprehensive API references, and interactive playground for testing components.
TypeScript Support
Full TypeScript support with proper type definitions, IntelliSense, and compile-time error checking for better code quality.
Accessibility First
Built with accessibility in mind, following WCAG guidelines and ensuring all components are usable by everyone.
Testing & Quality
Comprehensive testing suite with unit tests, integration tests, and visual regression testing to ensure reliability.
Key Features
- Vue 3 Composition API: Modern reactive patterns with better TypeScript support
- Tailwind CSS: Utility-first styling with easy customization
- TypeScript: Full type definitions for enhanced developer experience
- Accessible: WCAG compliant components
- Tested: Comprehensive test coverage with Vitest and Playwright
- Nuxt Ready: First-class support for Nuxt applications
Requirements
- Node.js: >= 22.12.0
- pnpm: >= 8.0.0 (recommended)
- Vue: ^3.5.13