productrating — Next.js 后台模板

SHA-256: 935e9afd882d55783f661db0d2793365028860d2381248c92735e13c01585069

2026-10-01T01:30:05.143Z

<p align="center">
  <img src=".github/banner.png" alt="ProductRating, a free SEO audit tool template for Next.js from tailthemes.com" width="100%">
</p>

<p align="center">
  <a href="LICENSE"><img alt="License: MIT" src="https://img.shields.io/badge/license-MIT-4ADE80?style=flat-square&labelColor=0B0D10"></a>
  <img alt="Version 1.0.0" src="https://img.shields.io/badge/version-1.0.0-1C2126?style=flat-square&labelColor=0B0D10">
  <img alt="Tailwind CSS v4" src="https://img.shields.io/badge/Tailwind_CSS-v4-1C2126?style=flat-square&labelColor=0B0D10">
  <img alt="Next.js 15" src="https://img.shields.io/badge/Next.js-15-1C2126?style=flat-square&labelColor=0B0D10">
  <img alt="TypeScript" src="https://img.shields.io/badge/TypeScript-strict-1C2126?style=flat-square&labelColor=0B0D10">
</p>

# ProductRating: free SEO audit tool template for Next.js

ProductRating is a free SEO audit tool template for Next.js, MIT licensed, for anyone building a checker that reports on product pages.

It is the interface of a scanner that runs in production. Paste a product URL and read five assessments, for Google, Bing, ChatGPT, Perplexity and Claude, each scored out of 100 with its evidence and a next step, with a catalog workspace behind them. The scan engine is not included: every screen renders the app's own example report, so connecting yours means returning the same shape.

**The live app:** ProductRating runs at [productrating-ten.vercel.app](https://productrating-ten.vercel.app). This repository is its interface.

One edition ships in this repository: a Next.js 15 project in `src/`. There is no HTML edition, because the app it replicates has none.

[Live demo](https://tailthemes.com/preview/productrating?utm_source=github&utm_medium=readme&utm_campaign=productrating) · [ProductRating on tailthemes.com](https://tailthemes.com/themes/productrating?utm_source=github&utm_medium=readme&utm_campaign=productrating)

## Screenshot

![ProductRating in light mode](.github/productrating-light.png)

ProductRating ships in light mode only, as the app it replicates does. Its tokens are one block in `src/theme.css`.

## Quickstart

```sh
bun install
bun dev
```

Then open http://localhost:3000.

The project is bun first. `npm install` and `npm run dev` work as well.

## What's inside

- **7 routes**: `/`, `/chatgpt`, `/checklist`, `/pricing`, `/workspace`, `/workspace/report`, `/workspace/billing`
- **14 components**, one file each, every one named in `theme.json`
- **287 design tokens**, light mode only, all in `src/theme.css`
- **4 agent skills** in `.claude/skills/`: `add-page`, `add-section`, `check-quality`, `rebrand`
- **2 typefaces** self hosted in `src/fonts/`: Geist and Geist Mono
- **1 dependency beyond React and Next.js**: `lucide-react`
- `AGENTS.md`, the file map and invariants, written for the agent in your editor

## Rebrand in one file

Every colour is a token in `src/theme.css`: the app's named palette, and every tint it derived from it. Change the values, keep the names, and every page follows. Spacing, radii and type sizes are the app's own values in `src/productrating.css`, kept as the live app writes them.

Agents get the procedure in writing: point yours at `.claude/skills/rebrand`.

## Issues welcome, pull requests closed

This repository is generated from our own source, so a patch merged here is overwritten by the next release. Open an issue instead and the fix lands upstream, then comes back in the next version. Forking is open, which is what the MIT grant is for.

## License

The theme is [MIT licensed](LICENSE). Use it in commercial work, modify it, ship it, resell what you build with it. No attribution required.

The typefaces are not ours to relicense. Geist and Geist Mono ship under the SIL Open Font License 1.1. Each family's license text sits verbatim beside its `.woff2` file in [`src/fonts/`](src/fonts). Keep those files with the fonts and you are within terms.

The theme ships no photography. The five provider marks are [LobeHub Icons](https://github.com/lobehub/lobe-icons), stored unchanged under their own MIT license in [`src/assets/providers/LICENSE`](src/assets/providers/LICENSE). Brand names and marks identify the assessed providers; their trademarks remain with their respective owners and do not imply endorsement.

## More themes

[ProductRating's page](https://tailthemes.com/themes/productrating?utm_source=github&utm_medium=readme&utm_campaign=productrating) has the full preview, the changelog and the download. [The catalog](https://tailthemes.com/templates?utm_source=github&utm_medium=readme&utm_campaign=productrating) has the rest: 3 more free themes and the paid ones.