Integrate data visualizations into React and Next.js applications. Use when the user needs chart components, UML-like or architecture diagram components, React integration patterns, Next.js client or server boundaries, hydration-safe rendering, lazy loading, framework-aware performance, scroll-driven visual stories, or export guidance.
Install
npx skills add openai/plugins --skill react-and-nextjs-data-visualizationnpx skills add openai/plugins --skill react-and-nextjs-data-visualization -a claude-code -gnpx skills add openai/plugins --skill react-and-nextjs-data-visualization -a codex -ggemini skills install https://github.com/openai/plugins.git --path plugins/build-web-data-visualization/skills/react-and-nextjs-data-visualizationgh skill install openai/plugins react-and-nextjs-data-visualizationgit clone --depth 1 https://github.com/openai/plugins /tmp/openai__plugins
mkdir -p ~/.claude/skills ~/.agents/skills
cp -R /tmp/openai__plugins/plugins/build-web-data-visualization/skills/react-and-nextjs-data-visualization ~/.claude/skills/react-and-nextjs-data-visualization # Claude Code
cp -R /tmp/openai__plugins/plugins/build-web-data-visualization/skills/react-and-nextjs-data-visualization ~/.agents/skills/react-and-nextjs-data-visualization # Codex, Cursor, Gemini CLI, Copilot, OpenCode