Premium Visual Reference Library

thegoat395/premium-visual-reference-library

Use when Codex needs premium visual inspiration sources, website galleries, studio references, product-site references, motion references, UI examples, luxury/editorial/Squarespace/Raycast/Linear/Vercel-level references, or a non-generic reference set before designing a website.

1k tokens

context cost

the whole folder, loaded on every use

files

instructions only

copies elsewhere

how many repositories repackaged it

115

stars on the repo

on the repository, not the skill itself

Install

one command, takes just this skill from the repository

npx skills add https://github.com/TheGoat395/Codex-Skills --skill premium-visual-reference-library

What comes with it

4 747 bytes besides the instruction

agents/openai.yaml

references/sources.md

The instruction itself

3 sections, as written by the author

Premium Visual Reference Library

Use this skill to pick reference sources before designing a premium website.

Workflow

Identify the site category: product/devtool, luxury/editorial, portfolio, hospitality, commerce, personal, agency, or content/media.
Read sources.md for the relevant source clusters.
Select 3-7 references, mixing live product sites, galleries, and implementation examples.
Extract concrete patterns: type, layout, density, media, motion, CTA, proof, navigation, section rhythm, and mobile behavior.
State what not to copy.
Convert the references into a Build-Ready UI Specification before coding.

Anti-Copy Rule

Use references to understand quality, not to clone compositions, copy assets, or imitate a brand too closely.

How to use it

Copy the folder

Take thegoat395/premium-visual-reference-library from the repository into ~/.claude/skills for personal use, or into .claude/skills inside a project.

Check the name does not clash

The agent identifies a skill by the name field in its header. Two skills with the same name cannot sit side by side — one of them will be ignored.