<!-- llms-explorer concept facts · https://llms-explorer.com/tree/ai-native-ux-and-generative-ui-design/ · pack 2026-09-08 · ~1163 tokens -->

# AI-Native UX and Generative UI Design

> The frontend, UI, and UX hub for designing and building user interfaces. This

Parent: [Frontend Design](https://llms-explorer.com/tree/frontend-design/) · 5 facets · 12 facts · page: https://llms-explorer.com/tree/ai-native-ux-and-generative-ui-design/

## Frontend & UI/UX Expert

- The frontend, UI, and UX hub for designing and building user interfaces. This skill covers the full surface of frontend work: visual and interaction design (layouts, design systems, tokens, color, typography), markup and styling (HTML semantics, CSS layout), platform targets (responsive web and native mobile/iOS), implementation review of framework-free UIs, and accessibility/UX evaluation against the published standards. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#frontend-uiux-expert)
- Use it when the task is about designing or implementing a user interface rather than the underlying language mechanics, generic software patterns, or Chrome-extension-specific UI surfaces. For a single deep sub-area, match the routing table below and read the corresponding reference file before answering. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#frontend-uiux-expert)

## How to use this skill

- This skill consolidates 9 frontend sub-skills as on-demand reference files. Match the task to the routing table below and Read the listed references/…md file before answering deep questions - the table alone is not enough for depth. For exact syntax, property, and platform-API details, defer to the official sources (HTML Living Standard, MDN, W3C WCAG 2.2, WAI-ARIA APG, Apple Human Interface Guidelines) as the source of truth. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#how-to-use-this-skill)

## Sub-skill routing table

- This hub absorbs 9 former standalone skills as on-demand reference files. When a task matches a row, Read the listed references/ file before answering - do not rely on this table alone for depth. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#sub-skill-routing-table)

## Cross-hub boundaries

- This hub owns frontend design, UI/UX, and interface implementation. Hand off when the task falls into a sibling hub: — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-boundaries)
  - Chrome-extension-specific UI - content scripts, shadow DOM injected into host pages, extension popup/options surfaces, MV3 UI plumbing → chrome-extension-expert. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-boundaries)
  - JavaScript / TypeScript language specifics - syntax, language APIs, type systems, runtime semantics → programming-languages. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-boundaries)
  - Language-agnostic software design patterns and architecture - generic design patterns, separation of concerns, structural patterns → software-engineering-patterns. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-boundaries)
- Some topics legitimately touch two hubs (e.g., a vanilla-JS UI review brushes against JS language mechanics, and an extension popup is still HTML/CSS). Lead with the hub that matches the user's intent - interface design and implementation intent stays here; language-mechanics or extension-runtime intent hands off. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-boundaries)
- Note: a separate plugin skill frontend-design:frontend-design also exists. This hub absorbs the top-level frontend-design skill (now references/frontend-design.md), not the plugin - invoke the plugin skill directly if that is what you need. — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-boundaries)
- <!-- cross-hub-map --> — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-boundaries)

## Cross-hub map — where every frontend topic lives

- This family is split across these hubs. If a task's deep material is not in this hub's Sub-skill routing table, it is a reference file under a sibling hub below - activate that hub or Read its references/<name>.md directly. Every former standalone skill in this family is now a reference under one of these hubs (nothing was deleted). — [source](https://llms-explorer.com/sources/mdb-context-hub/frontend-ui/#cross-hub-map-where-every-frontend-topic-lives)

## Context files

- [AI-Native UX and Generative UI Design](https://llms-explorer.com/downloads/sources/mdb-context-hub/frontend-ui.md)
