# Understanding the structure of data/style-library.json in Awesome-GPT-Image-2

> Explore the structure of data/style-library.json in Awesome-GPT-Image-2. Learn how its 8 keys define visual tags, categories, styles, scenes, and prompt templates.

- Repository: [苍何/awesome-gpt-image-2](https://github.com/freestylefly/awesome-gpt-image-2)
- Tags: api-reference
- Published: 2026-09-01

---

**The [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) file in Awesome-GPT-Image-2 is a master configuration file with 8 top-level keys—`version`, `repository`, `templateDocument`, `tagLabels`, `categories`, `styles`, `scenes`, and `templates`—that together define all visual tags, categories, styles, scenes, and prompt templates used by the repository.**

This JSON file serves as the central knowledge base for the entire Awesome-GPT-Image-2 project (github.com/freestylefly/awesome-gpt-image-2). It enables bilingual (English/Chinese) UI rendering, consistent terminology across components, and extensible prompt template management. Any tool consuming this repository—from React components to Python scripts—parses this single file to understand what prompt styles, scenes, and templates are available.

## Top-Level Structure of style-library.json

The file opens with metadata fields before defining the actual content hierarchies.

| Key | Purpose | Line Reference |
|:---|:---|:---|
| `version` | JSON schema version (currently `1`) | [line 2](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L2) |
| `repository` | URL of the source repository | [line 3](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L3) |
| `templateDocument` | Path to markdown file with human-readable template list | [line 4](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L4) |
| `tagLabels` | Bilingual display names for short tag identifiers | [lines 5–31](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L5-L31) |
| `categories` | UI-oriented categories with metadata and visual assets | [lines 32–88](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L32-L88) |
| `styles` | Visual styles (e.g., `3d`, `brand`, `ui`) with multilingual titles | [lines 89–110](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L89-L110) |
| `scenes` | High-level usage scenarios with keyword hints | [lines 111–122](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L111-L122) |
| `templates` | Detailed prompt template definitions (bulk of the file) | [lines 123–818](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json#L123-L818) |

## The tagLabels Object

The `tagLabels` section provides **bilingual translations** for short tag identifiers. Each key maps to an object with `en` and `zh` fields.

This design allows UI components to render tags like `Art` or `Campaign` in the user's preferred language without hardcoding strings throughout the application.

## Categories Array Structure

Each entry in the `categories` array defines a distinct visual category available in the UI. According to the Awesome-GPT-Image-2 source code, a category object contains:

- **`id`** — Stable identifier used in code (e.g., `cat-ui`, `cat-infographic`)
- **`value`** — Human-readable English label
- **`anchor`** / **`templateAnchor`** — URL slugs for deep linking and template binding
- **`cover`** — Relative path to a thumbnail image
- **`title`** — Multilingual title object with `en` and `zh` properties
- **`description`** — Multilingual description object

The `templateAnchor` field creates a **bidirectional linkage** between categories and their associated templates, enabling navigation from category views to concrete prompts.

## Styles and Scenes Arrays

Both `styles` and `scenes` follow an identical lightweight schema:

| Field | Description |
|:---|:---|
| `id` | Unique identifier |
| `value` | Machine-friendly value |
| `title` | Multilingual display name |
| `keywords` | Optional array for filter/suggest functionality |

The `keywords` array helps the UI suggest appropriate styles when users type free-text prompts, improving discoverability without requiring exact matches on style names.

## Templates Array: The Core Content

The `templates` array contains the **most detailed objects** in [`style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/style-library.json), spanning the majority of the file's lines. Each template is a complete prompt recipe with these fields:

| Field | Purpose |
|:---|:---|
| `id` | Unique template identifier |
| `anchor` | URL fragment for direct linking |
| `cover` | Representative preview image |
| `title` / `description` | Multilingual metadata |
| `category` | Human-readable category name (links to `categories`) |
| `styles` | Array of style IDs this template supports |
| `scenes` | Array of scene IDs appropriate for this template |
| `tags` | Additional searchable keywords |
| `useWhen` | Guidance on when to apply this template |
| `guidance` | Step-by-step prompt construction tips (bilingual) |
| `pitfalls` | Common mistakes to avoid |
| `exampleCases` | IDs of example prompts stored elsewhere in the repo |

This structure separates **presentation metadata** (titles, descriptions, images) from **functional relationships** (styles, scenes, categories), making the file both human-readable and machine-parseable.

## Working with style-library.json in Code

### Node.js Example: Loading and Querying the Library

```javascript
import fs from 'fs';
import path from 'path';

// Load the library (relative to project root)
const libPath = path.resolve('data', 'style-library.json');
const library = JSON.parse(fs.readFileSync(libPath, 'utf8'));

// Example: list all category titles (English)
const categoryTitles = library.categories.map(c => c.title.en);
console.log('Categories:', categoryTitles);

// Example: find all templates that support the "UI" style
const uiTemplates = library.templates.filter(t => t.styles.includes('UI'));
console.log('UI Templates count:', uiTemplates.length);

```

### Python Example: Filtering by Scene and Style

```python
import json
from pathlib import Path

with open(Path('data/style-library.json')) as f:
    lib = json.load(f)

def templates_for(scene, style):
    return [
        t['id']
        for t in lib['templates']
        if scene in t['scenes'] and style in t['styles']
    ]

print(templates_for('Tech', 'UI'))   # → ['ui-screenshot-system']

```

## Related Files in the Repository

| File | Role |
|:---|:---|
| [`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json) | Central configuration (this file) |
| [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md) | Human-readable template documentation referenced by `templateDocument` |
| [`src/components/CategoryPicker.jsx`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/components/CategoryPicker.jsx) | Example UI component consuming `categories` |
| [`src/utils/styleLibrary.js`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/src/utils/styleLibrary.js) | Helper module for JSON loading and lookup functions |

## Summary

- **[`data/style-library.json`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/data/style-library.json)** uses **8 top-level keys** to organize all visual and template metadata in one location.

- **Bilingual support** is built into `tagLabels`, `categories`, `styles`, `scenes`, and `templates` through consistent `en`/`zh` object patterns.

- **Relationship fields** (`category`, `styles`, `scenes`, `templateAnchor`) enable automatic UI generation and deep linking without hardcoded logic.

- **Extensibility** is straightforward: adding new categories, styles, or templates requires only appending entries—the consuming logic picks them up automatically.

- **The `templates` array** contains the richest data, including guidance, pitfalls, and example case references that separate prompt engineering knowledge from presentation code.

## Frequently Asked Questions

### What format are the multilingual strings in style-library.json?

All multilingual strings follow a consistent object pattern with `en` and `zh` keys. For example, a title field appears as `{"en": "UI Design", "zh": "UI设计"}`. This uniform structure allows UI components to switch languages by simply selecting the appropriate property.

### How do templates link to categories in the JSON structure?

Templates use the `category` field with a human-readable string that matches a category's `value` field, while categories use `templateAnchor` to specify URL fragments. The bidirectional reference enables both programmatic lookup and user-friendly navigation.

### Can I add custom styles or scenes without modifying code?

Yes. The `styles` and `scenes` arrays accept new entries with `id`, `value`, `title`, and optional `keywords` fields. As long as templates reference the new IDs in their `styles` or `scenes` arrays, UI components consuming the JSON will automatically include them.

### Where are the actual prompt examples stored?

The `exampleCases` field in each template contains IDs that reference example prompts stored elsewhere in the repository—typically in separate case files or documentation. The `templateDocument` field points to [`docs/templates.md`](https://github.com/freestylefly/awesome-gpt-image-2/blob/main/docs/templates.md) for human-readable descriptions, while programmatic access uses the structured JSON data.