OpenAPI Nested Tags

OpenAPI 중첩 태그

OpenAPI 3.2 parent and kind organize operation tags into a documentation hierarchy.

···
html
<div class="viz"><h3>TAG NAVIGATION</h3><div class="tagtree"><div class="box">products</div><div class="branch" id="branch"><div class="box">books</div><div class="box">games</div></div></div><div class="muted" id="tag-note">parent: products · kind: nav</div></div>
css
.viz{width:94%;height:88%;max-width:960px;padding:clamp(10px,2vmin,18px);border:1px solid var(--line);border-radius:14px;background:var(--surface);font:600 clamp(12px,1.35vw,16px)/1.35 var(--font-sans,system-ui,sans-serif);display:flex;flex-direction:column;gap:clamp(7px,1.8vmin,13px);overflow:hidden}.viz h3{margin:0;color:var(--accent);font:700 clamp(12px,1.35vw,16px)/1.2 var(--font-sans,system-ui,sans-serif);letter-spacing:.04em}.viz .row{display:flex;align-items:center;justify-content:center;gap:clamp(5px,1.4vmin,12px);flex:1;min-height:0}.viz .box{padding:clamp(5px,1.5vmin,12px);border:1px solid var(--line);border-radius:9px;background:var(--bg);text-align:center}.viz .muted{color:var(--muted)}.viz .accent{color:var(--accent)}.viz .code{font-family:ui-monospace,monospace}.viz .pill{padding:3px 7px;border:1px solid var(--line);border-radius:99px;white-space:nowrap}.viz .active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--surface))}.viz .arrow{color:var(--accent);font:700 18px ui-monospace,monospace}.tagtree{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex:1}.tagtree .box{min-width:72px}.branch{display:flex;gap:8px;transition:transform .5s,opacity .5s}.branch.flat{transform:translateY(-8px);opacity:.45}.branch:not(.flat){border-left:2px solid var(--accent);padding-left:12px}
js
let nested=true;function draw(){nested=!nested;document.getElementById('branch').classList.toggle('flat',!nested);document.getElementById('tag-note').textContent=nested?'parent: products · kind: nav':'flat tag list'}draw();setInterval(draw,1500)

OpenAPI 3.2 Tag Objects add a short summary, a parent tag name, and a kind that classifies the tag’s purpose. For example, a nav tag named books can point to products as its parent so documentation groups those operations beneath products. The parent must exist in the description, and cycles are forbidden.

The demo turns a flat tag list into a navigation tree. Check that documentation tooling supports the new fields, and assign kind deliberately so navigation and code generation groupings stay clear.

When to use

Use it to organize navigation in documentation with many operations.

Open as page ↗