Dark luxury multi-page tattoo website for Indigo Ink by Andres, Uhldingen-Mühlhofen, Germany.
Generated Prompt
# **## APPLICATION OVERVIEW Indigo Ink by Andres is a luxurious multi-page tattoo website designed to showcase artistry in a sophisticated manner. The website will serve as an elegant online presence that provides potential clients with information about the tattoo studio, artist portfolio, client testimonials, booking options, and location details, all while maintaining a dark luxury aesthetic. ## CORE FEATURES 1. **Home Page**: An engaging introduction to Indigo Ink with a striking hero section that features captivating images and a brief tagline, leading to other sections of the site. 2. **About Page**: Detailed information about the artist, the philosophy behind Indigo Ink, and the studio's values, fostering a personal connection with visitors. 3. **Portfolio Page**: A visually stunning masonry grid showcasing previous tattoo work with hover overlays that provide additional details about each piece. 4. **Testimonials Page**: Featuring lifted cards with client feedback, highlighted with a gold left-border to emphasize positive experiences. 5. **Booking Page**: A premium, borderless booking form with a gold focus glow effect, integrated with a WhatsApp floating action button for instant communication. 6. **Find Us Page**: An interactive map with a dark CSS filter, providing location details and directions for visitors. ## DESIGN SPECIFICATIONS - **Visual Style**: Dark luxury with a minimalist approach, focusing on clean layouts and elegant typography. - **Color Mode**: Predominantly black (#07070D) with gold accents, ensuring a rich and opulent feel—zero white. - **Layout**: Each page will feature a sticky blur navbar for seamless navigation. Unique scroll-reveal animations will enhance engagement, and cubic-bezier transitions will create smooth interactions. - **Typography**: Use Cinzel Decorative for headings and Cormorant Garamond for body text, maintaining a sophisticated editorial feel throughout. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript for robust application structure and type safety. - **Styling**: Tailwind CSS for a utility-first approach, allowing for rapid styling and responsiveness. - **UI Components**: Utilize shadcn/ui for pre-built components that align with the design needs. - **State Management**: Use React's built-in context API or a lightweight state management library if needed. ## IMPLEMENTATION STEPS 1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS along with shadcn/ui components. 2. **Create Page Components**: Develop individual components for Home, About, Portfolio, Testimonials, Booking, and Find Us pages, ensuring a consistent layout and design. 3. **Implement Navigation**: Design and implement a sticky blur navbar that links all pages for easy navigation. 4. **Integrate Animations**: Add unique scroll-reveal animations and cubic-bezier transitions for a modern user experience. 5. **Build Portfolio Layout**: Create the masonry grid for the Portfolio page, ensuring hover overlays display additional information about each tattoo. 6. **Develop Booking Functionality**: Implement the borderless premium booking form with focus effects and the WhatsApp floating action button. 7. **Map Integration**: Integrate a map feature on the Find Us page with a dark CSS filter to maintain visual consistency.# ## USER EXPERIENCE Visitors to the Indigo Ink website will enjoy an immersive and intuitive experience. As they scroll through the pages, they will encounter smooth animations and transitions that enhance engagement. The sticky navbar ensures that navigation remains accessible, while the unique layout and luxurious design elements create a memorable impression. Users will easily navigate to the Portfolio to admire the artist's work, read testimonials to build trust, and complete the seamless booking process to secure their own tattoos. The overall experience will reflect the high-end nature of the brand, making it inviting and elegant for potential clients.**
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
