# Free lighting store website template

> Free HTML lighting store website template for lamp shops and showrooms, with a priced lamp list and repairs. AGENTS.md for Claude Code, or no code with 8B. Made by 8B (https://8b.com/), an AI website builder. Updated October 2026.

Lighting store website template: a free one-page HTML site for a lamp shop or showroom that also draws lighting plans and repairs old lamps. It has six rooms, a priced lamp list, a weekend loan and a late-opening night, in light grey and ink with one yellow for the light. One file with AGENTS.md, ready for an AI agent.

- Page: https://8b.com/templates/glim/
- Live demo: https://8b.com/templates/glim/demo.html
- DESIGN.md (design tokens and motion rules): https://8b.com/templates/glim/DESIGN.md
- Repository (GitHub template): https://github.com/8bsite/lighting-store-website-template
- Download ZIP: https://8b.com/templates/glim/lighting-store-website-template.zip
- Template name in the repository: Glim
- At a glance: One 91 KB index.html with its CSS and JavaScript inside, 12 sections, 17 Unsplash photos credited in CREDITS.md, Geist from Google Fonts, GSAP 3.13.0 (ScrollTrigger); Lenis 1.3.4 smooth scroll loaded from jsDelivr.

## Use it with an AI coding agent

Download the files into the project (Windows PowerShell: `curl.exe`):

```bash
curl -LO https://raw.githubusercontent.com/8bsite/lighting-store-website-template/main/index.html
curl -LO https://raw.githubusercontent.com/8bsite/lighting-store-website-template/main/AGENTS.md
curl -LO https://raw.githubusercontent.com/8bsite/lighting-store-website-template/main/LICENSE
curl -LO https://raw.githubusercontent.com/8bsite/lighting-store-website-template/main/CREDITS.md
```

Then give the agent this prompt:

```text
Read AGENTS.md, then edit index.html. Make this the site for <my shop: name, city and address, opening hours, lamp types with real prices, the makers I stock, delivery and return terms, lighting plan and repair prices, loan rules, contacts>. Replace first the shop name, the six lamp prices, ten workshops and Glasgow details. Keep the section ids and the selectors AGENTS.md lists, and set the footer wordmark's --len to the new name's character count. Ask me for missing facts and never invent prices, stock, makers, hours, reviews or contacts.
```

Work on the downloaded file, not on a link. AGENTS.md lists what to keep and what to replace. Or copy the whole repository: `npx degit 8bsite/lighting-store-website-template my-site`.

## About

A lamp shop, lighting showroom, lamp repair workshop or interior lighting studio fits this lighting website template directly. A homeware or furniture shop with a showroom can swap the six lamp types for its own product lines, which makes it a home decor website template as well. It is plain HTML under the MIT license, so anyone looking for home decor website templates free of charge can start here.

Vibe coding with Claude Code, Cursor or Codex goes fastest when the agent has the shop's facts: six lamp prices, ten workshops, hours, address, delivery and returns, plan and loan terms, repair promises. The demo invents all of them, including the Glasgow address and the company name. Replace the name wherever it appears and set the footer wordmark's --len to its length. Room columns and lamp rows can be added or removed; the three service columns and three loan days are fixed by their grids.

This is a good base for a shop that sells by showing lamps lit, drawing plans and mending old ones. It has no basket, so a shop with checkout needs its own links on the buttons. A designer who sells a method rather than products may prefer the [interior colour studio](https://8b.com/templates/pervenche/) template. Not a coder? 8B can build a different site from a sentence.

## Design

- Palette: #ececec (page background and the text colour of links on their hover fill), #121212 (text, hairline rules, outlines, the dark first screen, the late-opening section, the footer and the menu overlay), #ffffff (top bar, makers section background and text on the dark sections), #ffd000 (the light: glows, photo strips, lit lamp-list lines, makers row rules, repair line and step bars, loan day bars, button hover fill, footer wordmark), #555555 (notes, price lines, the product line under each workshop's city, unlit repair steps and photo placeholders), #a3a3a3 (body text on the dark sections, the first screen rules, the late-opening rings and the footer's resting wordmark)
- Fonts: Geist (the only typeface, one variable file for weights 200 to 800: light headings, regular body, medium buttons and links, bold wordmarks, with workshop names and the footer mark changing weight on scroll)

A three column grid (about 34, 38 and 28 percent) returns in the first screen, loan, repairs and footer, divided by hairline rules. The first screen is dark, with two rules, a photo in the first column and three service columns along the bottom. Light sections alternate with a white makers list and a dark late-opening section with a round photo. Six room columns run sideways in one pinned track, and the lamp list keeps one photo frame beside it.

Buttons are pairs of outlined ellipses that fill with a yellow glow on hover. Yellow is used as light: a pool behind the first photo, strips beside photos, lit lines on the lamp list and repair steps. Headings are light; workshop names and the footer wordmark thicken as you scroll.

## Sections and motion

- **Navigation** (navigation): white top bar: wordmark, five section links and a menu button that opens a full-screen overlay with seven links; hides on scroll down. Motion: The white bar slides away when you scroll down past 140 px and returns on scroll up; Lenis smooth scrolling runs page-wide.
- **Daylight sets the room. Lamps finish it.** (opening): first screen: dark ground with two hairline rules, the headline, a Shop lamps button, a photo of a glowing lamp and three service columns. Motion: On load the two rules draw down, the heading lifts, the button opens, the photo opens from below and the three services lift in turn, while a yellow pool behind the photo drifts in a loop.
- **Light, room by room** (rooms): pinned sideways track: an intro column, six room columns (kitchen, bath, bedroom, living, study, hall) and a closing column with a button. Motion: Pinned: six room columns slide sideways, and as each reaches the middle its yellow strip rises, its photo goes from dim grey to colour and its squiggle draws.
- **Six ways to light a room** (collection): list of six lamp types with a price, a link and one photo frame beside the list that changes as each type is read. Motion: On desktop one photo frame stays on the right and each next lamp photo rises into it as its row is read, while a yellow bar along the list's left edge rises and drops with each row.
- **A plan before a single hole is drilled** (plans): split section: heading, paragraph and a photo on the left, three numbered steps and a button on the right. Motion: The heading block rises in, the photo goes from dim grey to full light as it crosses the screen and a hairline draws above each step.
- **Made by hands, not lines** (makers): left heading and paragraph, right a list of ten workshops with city and what they make. Motion: Each workshop name thickens from light to bold as its row nears the middle of the screen, and its rule turns yellow and heavier.
- **Borrow a lamp for the weekend** (try): loan offer: heading, paragraph, button and note beside a large photo, then three day columns (Friday, The weekend, Monday). Motion: The heading block rises in, the photo switches on from grey and a yellow bar draws over each of the three days.
- **Bring us the lamp you cannot throw away** (repairs): repair offer with a before and after photo of an old lamp and four numbered steps. Motion: A yellow line sweeps down the framed photo and leaves the colour copy behind it, while the four steps light in turn.
- **Before the lamps arrive** (faq): heading with a link to the contact form beside five questions as native details elements. Motion: The heading rises in and a hairline draws above each of the five questions as it arrives.
- **Open till nine on Thursdays** (thursdays): dark section about late opening: a two-part heading, a round photo, hours and a link. Motion: The round photo opens from a thin slit to a full circle while it zooms out, its rings stretch and the two heading lines slide in from opposite sides.
- **Come and see them lit** (contact): address, opening hours, phone and email on the left, a contact form on the right. Motion: A yellow glow behind the address grows and brightens as it scrolls into view, and the heading block rises in.
- **Shop** (footer): dark footer: shop links, showroom address, phone and email, a large wordmark and the copyright line. Motion: The large wordmark thickens and turns from grey to yellow as it scrolls into view.

## Good for

- lighting shop or lamp showroom
- furniture, homeware or interior design shop with a showroom
- lighting designer or lamp repair workshop
- small shop that sells made-to-order or craft goods and offers a planning service

## Questions

**Is this lighting store website template free for a client's shop?** Yes. It is one index.html under the MIT license, so you can build it for clients at no cost. The scripts sit inside the file, GSAP, ScrollTrigger and Lenis load from jsDelivr, and there is no build step. Photos are Unsplash images listed in CREDITS.md.

**Can I get a site like this without editing code?** Not this file; it needs a coding agent or a developer. [8B's AI website builder](https://8b.com/) designs a new site, with its own look, from a sentence. Designing and restyling are free. Publishing with hosting and SSL, full HTML export and AI edits in chat are on Pro at $9 a month billed yearly. It also runs inside Claude and ChatGPT.

**Can it be a home decor ecommerce website template with a basket?** No. There is no basket, checkout or product database. Every button jumps to an anchor on the page. Point the shop buttons and the six room links at your online shop or category pages, or keep the enquiry form for a showroom that sells in person.

**How do I give it to Claude Code, Cursor or Codex?** Download index.html and AGENTS.md with the curl lines on this page, then paste the prompt above into the agent. AGENTS.md lists what to replace, what to ask the owner and what scripts read. The edit works in a plain folder, with no framework or build step.

**What must I keep when I change the text?** Keep the section ids, the data-8b-section, data-8b-motion and data-8b-part attributes and the selectors AGENTS.md lists, and set the footer wordmark's --len to the new name's length. Keep the header comment, the 8B meta tag and the Design: 8B footer link unless the site owner asks to remove it. With reduced motion the page still reads in full.

**Does the contact form send messages?** No. As shipped, the script checks the name, email and message, shows a thank-you line and sends nothing. Connect it to Formspree or Netlify Forms, or delete the form and keep the phone and email. Without JavaScript it shows no thank-you line at all.

## Before publishing

Replace: social preview image, favicon, phone number, email address and contact form (sends nothing yet), plus the invented demo facts (prices, dates, addresses).

- Shop lamps button on the first screen lead to #collection (the lamp types section, there is no online shop) now; point them to your online shop or product catalogue.
- Browse the lamps, Start a plan and Book a repair links under the three services on the first screen lead to #collection, #plans and #repairs now; point them to keep as anchors, or point them at your shop category, plan request and repair booking pages.
- Kitchen pendants, Bathroom wall lights, Bedside lights, Floor and table lamps, Desk lamps and Wall lights links in the six room columns lead to #collection now; point them to the matching category pages of your shop.
- Start a plan button in the last room column and in the lighting plans section lead to #plans in the room column, #contact in the plans section now; point them to your lighting plan request form or booking page.
- Ask about pendants, table lamps, floor lamps, wall lights, outdoor lights and bulbs links in the lamp list lead to #contact now; point them to the product category pages, or keep #contact for enquiries.
- Borrow a lamp button in the weekend loan section lead to #contact now; point them to your loan request form or booking page.
- Book a repair button in the repairs section lead to #contact now; point them to your repair booking page, or keep #contact.
- Plan a Thursday visit link in the late opening section lead to #contact now; point them to your visit booking page, or keep #contact.
- Send button of the contact form lead to the form has action="#" and method="post"; the script only checks the required fields and shows the thank-you line, nothing is sent now; point them to your form handler (Formspree, Netlify Forms or your own endpoint), or remove the form and keep the phone and email.
- The pinned rooms track is about 2100 px of scrolling on a 1440 px screen and about 1900 px on a 375 px phone, and each room column is fixed to the screen height while pinned, so long texts can run under the photo on short windows.
- The first screen photo and the other photos are lazy-loaded, including the first-screen one, and they come from Unsplash at the sizes in the URLs; self-host them before launch.
- Several small texts (13 px) carry the prices and notes; the prices in the lamp list are in the small size.
- There is no online shop or basket: every button goes to an anchor on the page, so a real shop needs its own links.

## License

Code MIT. Photos: Unsplash License (credits in CREDITS.md). Fonts: SIL Open Font License 1.1. Browsers: Chrome and Edge 111+, Safari 16.2+, Firefox 113+ (it uses color-mix(), cascade layers, small/dynamic viewport units).
