design-and-settings-of-elements
Skill68 starsChanged yesterdayMITView on GitHub
Both natures. The look of an element (design skills tested on a test home page, the approved design, colours and fonts) and its site settings (name, search, languages, menus, cookie banner, switches, the CONFIG link): where each is changed — the core's «Build → Design» and «Build → Site settings» of the element — and how the whole design path runs from the architect's Telegram with `npm run design`. Load it when the person asks to choose or test design skills, to make or compare test pages, to approve a design, to change colours, a font, the title, the menu, «hide sign-in», «turn on the footer», sends a screenshot or a link of a site whose style they like, asks where an element's design or settings are, or asks for a page or a section of one (a hero, pricing, questions, a comparison) and where such sections live.
2 other projects use a version of this, 2 of them edited.
Adopted by
Most recently taken up by
- Fractera/Agent-Engineering-Infrastructureedited, first seen Nov 8, 2026
- Fractera/Agentic-Engineering-Infrastructureedited, first seen Nov 8, 2026
Other versions2 projects use a version of this.
Word for word · 0
None found.
Edited · 2
- Fractera/Agent-Engineering-Infrastructure★ 6121% same
- Fractera/Agentic-Engineering-Infrastructure★ 6121% same
Wrote their own version · 0
None found.
How matches are found. Word for word: the exact same text. Edited: shares passages with this file (“99% same” means 99% of its five-word phrases also appear here; 10% or more counts). Their own version: similar meaning, or, weakest, the same name. We can’t tell which project had it first. Projects are counted among the 200 most-starred candidates, and mentions are links to the repository we found, up to 50 per site, so both counts are a floor.
In this repository91 other files it gives its agents.
- app/AGENTS.mdAGENTS.md
- CLAUDE.mdCLAUDE.md
- adopt-suggested-skillSkill
- ai-elementsSkill
- ai-sdkSkill
- answer-elementSkill
- ask-elementSkill
- audit-broken-charactersSkill
- build-product-with-ownerSkill
- content-factorySkill
- core-build-returnSkill
- core-scheduleSkill
- create-elementSkill
- create-multilingual-content-entrySkill
- dedicated-serverSkill
- element-permissionSkill
- element-powerSkill
- expand-site-languageSkill
- explain-this-projectSkill
- find-skillsSkill
- fractera-vs-anthropicSkill
- handle-needSkill
- helpful-linksSkill
- help-in-browserSkill
- humanizerSkill
- integratorSkill
- interface-designSkill
- know-the-architectSkill
- manage-app-settingsSkill
- money-and-resourcesSkill
- node-typeSkill
- own-agentsSkill
- persist-env-var-with-rebuildSkill
- place-page-in-menuSkill
- provider-rulesSkill
- release-templateSkill
- researchSkill
- review-pageSkill
- route-to-elementSkill
- self-reviewSkill
- shadcnSkill
- shape-the-needSkill
- skill-creatorSkill
- study-for-elementSkill
- supervise-elementSkill
- translate-pendingSkill
- ultracode-sessionSkill
- use-agentic-ragSkill
- use-ai-generationSkill
- use-aioSkill
- use-app-configSkill
- use-auth-providersSkill
- use-authSkill
- use-browserSkill
- use-channelsSkill
- use-chatSkill
- use-code-shapeSkill
- use-databaseSkill
- use-dataSkill
- use-deep-memorySkill
- The first 60 shown.
The file
We split this skill into the rules it gives an agent
1 rule. About 0 are common, 0 are distinctive, and 1 is very specific to this project.
≈0
Common · estimate
Many files like this have a rule of this kind.
≈0
Distinctive · estimate
This author's own choices. Worth a look.
1
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Very specific: line 32
Every element designs its own pages: its sections are its own code (components/sections/ of that element), built by its agent's design pass …
≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
Design and settings of elements
Process: working — data only: the element's agent builds every page; you pass the person's choices through the core's door.
A hint, not a law: models of late 2026 work worse under rigid step-by-step instructions.
Where things are (node steps 712, 713, 715)
- Design — the core's page
/<lang>/<element>/build/design, three steps: 1 Skills — the library of design skills of third-party developers (each with its GitHub repository), the person saves the ones to test; 2 Brief — optional; 3 Generate and compare — a carousel (red «not generated», amber «being built», green «generated»), the chosen test page large, «Change the reference», «Fine tuning» and «Approve this design for the element». After the approval the person asks the element's agent for every important page in turn — it builds them in that design. - Site settings —
/<lang>/<element>/build/site-settings: the CONFIG link in one line on top, then sections (basics, search, meta and media, languages, header, footer, cookie banner, switches, Web4 network). A saved value redraws the pages with no build; only languages need a deploy. Linked to CONFIG — the values are read-only there and change in CONFIG. - A look the settings cannot express (a new token, a new section) is code — hand it to the element's agent (
route-to-element). - One design for a family of elements (step 717-5; the owner: «рабочие страницы выполнены с использованием одного и того же
навыка»). A new element:
npm run create -- … --look-like <x>. An element already born: on the person's wordnpm run look -- <id> --like <x>— the core puts the look X took into the core (registrylook; X rannpm run describe:publish) into the element's intake as a copy, never a live link and never X's folder; its own agent applies it withnpm run design:takeand shows the pages — wake it withnpm run task -- <id> "Take the look waiting in your intake". X's pictures stay X's; each element's sections stay its own code.
A page or a section of a page (node step 716)
Every element designs its own pages: its sections are its own code (components/sections/ of that element), built by its agent's design
pass in the element's approved design; the node has no shared catalogue of sections and no shared design. A request for a page or a
section of element X goes to X's agent, never to you — npm run task -- <id> "Build process, design: <the person's words>" (the node
starts the session of that pass with its own skills) or X's terminal and Telegram bot (route-to-element). Why one change needs a build
and another does not, in the person's words: a new section is code — the element is built once (beside the running version, switched in
seconds); a new page made of sections the element already has, other words or another order is page data — no build.
The design path from Telegram (the owner 2026-11-10: «создания проекта прямо из Telegram в том числе и дизайна»)
The same actions as the tab, through the same door: npm run design -- <element> <command>.
- «покажи навыки дизайна» →
library [words]: say the number, then three to five names — each with its GitHub link and one line of what it brings; never the whole list. - «возьми на тест X» →
choose <mark>. «убери X» →drop <mark>. - A photo or a link of a site they like → for a photo
download_attachment, thenref <mark> <file> --caption "<their words>"; a link —ref <mark> <https://…>. Ask which skill only if more than one is saved. - «сгенерируй» → say the price first (
stateprints it), thengenerate <mark>; it takes about ten minutes; the command puts the element under your supervision for one cycle, so its «done» wakes you — thenshots <id>and send both pictures to the chat with one line each and the link of the whole page (on this computerhttp://127.0.0.1:<its port>/<lang>/prototypes/<id>, on its own domain its address). - «утверди этот» → only on their explicit yes for a named test page:
approve <id>; then tell them to ask the element's agent for the other pages one by one (its terminal or its Telegram bot). stateanswers «как там дизайн?» in two lines: what is saved, what is generated, what is approved.
A skill with scripts is installed only after a separate «yes» (generate … --scripts-yes). One generation at a time per element.
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

