Tattoo React Template – Finelia

About This Item

Finelia React is a tattoo React template, made for a fine-line tattoo and piercing studio. It rebuilds the Finelia design as a React 18 app with Vite. Every page is a function component, and React Router moves between all 31 pages without a reload.

The look and the content match the Finelia demo. Underneath, the tattoo, piercing & booking logic runs in React state. That covers a piercing menu priced by placement and jewellery style and metal; a fine-line estimate by the size in centimetres; booking with ID and age rules worked out for the day of the visit; aftercare by piercing with the downsize and healing dates; an ear curator; open now and walk-in piercing from the clock; and a jewellery shop in titanium and 14k gold, and the page updates the moment a visitor changes an option.

Three Home Pages As Components

• The Studio – a full-screen slider with the title on three set lines.
• Piercing & Jewellery – three curated ears drawn in fine line with their jewellery and prices, four placements.
• Fine Line – one piece per screen with its size, hours, placement and style.

Tattoo, Piercing & Booking Pages In React

• Piercing Menu – 18 placements with their gauge, healing time and youngest age.
• Tattoo Estimate – width and height in centimetres, single line, fine detail or soft shading, the ink.
• Book A Visit – six steps: the visit, the artist, a day and a free start, your details.
• Aftercare – choose your piercing and the day it was done: today’s healing stage on a.
• Ear Curation – tap the drawn ear to add placements.
• The Jewellery Shop – 16 pieces and the aftercare range.

Tattoo React Template Features

• React 18 function components and hooks across 31 pages
• Vite for a fast dev server and an optimised production build
• React Router routes for every page, including the three home pages
• Cart, theme and language state shared through React Context
• Light and dark mode on one switch, remembered between visits
• Right-to-left layouts for every page
• Responsive from phones to wide screens
• Documentation for setup, structure and changes

Getting Started

First, install Node 18 or newer. Then run npm install and npm run dev to open the site locally. When it is ready, npm run build writes static files that any host can serve.

Looking for this tattoo React template in another stack? Finelia also comes as HTML5, Vue, Angular and WordPress. You can get every format in the developer bundle at 20% off, or browse more Tattoo Studio React templates.

Built with React and Vite, with Crimson Text and Barlow from Google Fonts.