Explore the foundational UI components, color palettes, typography scales, and design standards used across Aquillasol.
The Aquillasol Style Guide serves as the centralized reference for our design system and front-end development standards. Its primary purpose is to ensure visual consistency, brand cohesion, and optimal user experience (UI/UX) across all web pages, digital products, custom applications, and marketing materials.
Our visual identity combines sleek dark-mode aesthetics with high-contrast neon accents, reflecting innovation, advanced technology, and professional reliability. The design framework is built to maintain clear visual hierarchy, accessibility, and responsiveness on all modern devices.
Aquillasol utilizes a carefully curated color palette optimized for high-end digital platforms:
Our typographic hierarchy uses modern sans-serif font families with flexible scaling rules to maintain legibility from mobile screens to enterprise desktop displays. Headings utilize bold font weights with tight letter spacing, while body text balances optimal line-height and relaxed character density.
Headings (H1 through H6) are engineered using prominent font sizes, semi-bold to bold weights, and tight letter spacing to grab user attention immediately. They establish clear structural context and guide readers effortlessly through content sections. Body text and paragraphs utilize balanced font sizes (text-xs to text-base), muted slate tones (text-slate-400), and optimized line heights (leading-relaxed) to maximize readability across desktop and mobile screens without causing eye strain.
Buttons and interactive CTAs are built with smooth hover transitions, clear borders, and high-contrast background styling (such as indigo accents and dark glassmorphism effects). They provide immediate visual feedback to user interactions, ensuring clear direction, intuitive navigation, and high conversion rates across all pages.
All components—including filter tabs, blog cards, navigation headers, form inputs, and modal containers—are built with reusable utility classes (Tailwind CSS). This modular approach accelerates development time, reduces code redundancy, and guarantees seamless cross-browser performance.
Development teams and designers should reference this style guide when building new features or updating existing interfaces for Aquillasol. Any modifications to global components or color themes must be synchronized across the core stylesheet repository.
For questions regarding design assets, UI components, or brand guidelines implementation, please connect with the Aquillasol engineering and design team.