Ember Studio - Tattoo Salon Barber Astro Template

Ember Studio is a polished, responsive Astro template built for tattoo studios, hair salons, barbershops, and other artist-led local businesses. The design pairs bold photography with an editorial layout that gives portfolios, practitioners, and consultation calls to action room to work.

The download includes a complete static Astro project, four individual artist profiles, folder-driven portfolio galleries, a responsive keyboard-accessible lightbox, an About page, consultation page, privacy page, custom 404 page, SEO metadata, structured data, sitemap, and beginner-friendly offline HTML documentation.

Business details, navigation, demo settings, artists, social links, and optional integrations are centralized for easier customization. The included tattoo presentation can be adapted for salons and barbershops using the documented presets and content guidance.

The static site works without a backend. Optional reference functions are included for a consultation form and Google Places reviews. Buyers can deploy the generated site to any provider that supports static Astro output; provider accounts and credentials are not included.

Demo photography shown on the live site is included under the documented source licenses. All demo people, studio details, reviews, and contact information are fictional and intended to be replaced.

Features

• Astro 7 and TypeScript
• Responsive static output
• Four complete artist profiles
• Eight portfolio images per artist
• Folder-driven image organization
• Accessible portfolio lightbox
• Optional consultation-form function
• Optional Google Places reviews function
• Demo and buyer modes
• SEO metadata, sitemap, and structured data
• Tattoo, salon, and barber adaptation guidance
• Custom CSS override file
• Offline HTML documentation
• Deploy anywhere that supports static sites

Requirements

• Node.js 22 or another currently supported LTS release compatible with Astro 7
• npm
• A modern browser
• Optional provider accounts only when enabling form, reviews, email, CAPTCHA, analytics, or booking integrations

Instructions

1. Download and extract the Ember Studio ZIP file.

2. Install Node.js 22 or another supported release compatible with Astro 7. npm is included with Node.js.

3. Open a terminal in the extracted project directory.

4. Run npm install to install dependencies.

5. Run npm run dev and open the local address displayed by Astro.

6. Edit src/data/site.ts to replace the fictional business identity, domain, contact details, social links, and navigation. Seller promotion is off automatically in a normal buyer build; there is no buyer demo switch to disable.

7. Edit src/data/team.ts for practitioners and profile content. Replace images under public/images/artists//; portfolio images placed in each artist's portfolio/ folder are discovered automatically.

8. Edit src/data/reviews.ts, page copy under src/pages/, and buyer overrides in src/styles/custom.css.

9. Optional consultation and Google Places functions are disabled by default. Copy .env.example to .env and configure server-side credentials only when enabling and testing those integrations.

10. Run npm run build and npm run preview before deployment.

11. Deploy the generated dist/ directory to Cloudflare Pages, Netlify, Vercel, or another static host.

12. Open documentation/index.html for the complete offline guide. Additional customization, industry preset, deployment, SEO, optional-function, licensing, and troubleshooting guides are included under docs/.