meridian

Name: meridian
Availability: InStock
Author: zephyrwang6

Create Meridian dashboard panels with glass-card styling and page.tsx registration.

14|4|Updated Mar 31, 2026

Search Tags:#claude code #navigation #dashboard #obsidian #nextjs #panel #meridian

Ready to run

npx skills add https://github.com/zephyrwang6/allSkills --skill meridian-zephyrwang6

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: meridian
Source: https://github.com/zephyrwang6/allSkills/tree/main/meridian
Command: npx skills add https://github.com/zephyrwang6/allSkills --skill meridian-zephyrwang6

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

这个 Skill 帮助你把 Meridian 仪表盘里的导航面板、分析面板和可视化模块按规范快速搭出来，避免在 Next.js 代码、注册路由和样式约束之间来回切换。

Core Features & Use Cases

单面板创建：一次只生成一个新面板，并按要求注册到 page.tsx，避免批量误改。
Meridian 集成：围绕本地 Obsidian Vault、Claude Code 和 Meridian API 端点组织实现，适合做左侧导航、自定义内容区和分析模块。
样式与数据规范：使用 glass-card、stat-value 等 Meridian CSS 类，并优先从本地文件系统或 API 动态读取数据。
Use Case：当你要为某个文件夹或功能区新增一个仪表盘面板时，它会指导你完成组件创建、路由接入和页面注册。

Quick Start

请根据当前 Meridian 项目需求，帮我创建一个新的单独面板并将它注册到 page.tsx。

Frequently Asked Questions about meridian

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I create a custom dashboard panel in a Next.js app using Obsidian vault data?▼

Yes, you can build Obsidian vault integrations for Next.js by reading local file-system data and connecting it through custom API routes. The Skill organizes implementation around local vault data and Meridian API endpoints to populate panel content dynamically.

What is the workflow for adding sidebar navigation to a Meridian dashboard?▼

Meridian dashboard panels require specific CSS classes such as glass-card and stat-value for proper styling. These styling constraints ensure visual consistency across custom panel components and sidebar navigation elements within the Next.js application.

Can I use Claude Code to automate Meridian dashboard panel generation?▼

Yes, you can use Claude Code to automate Meridian dashboard panel generation by prompting it to build a single custom panel component. It handles component creation, route integration, and page.tsx registration based on your project conventions.

Does building Meridian panels allow generating multiple components at once?▼

Building Meridian panels does not allow generating multiple components at once. The workflow strictly requires a one-panel-at-a-time approach, ensuring each custom component is individually registered in page.tsx to avoid batch errors and maintain route integrity.

How do I register a new Meridian panel component in my Next.js application?▼

To register a new Meridian panel component in a Next.js application, you add it to the page.tsx file alongside its related API routes. This ensures the local file-system data flows correctly to the custom panel using the required glass-card styling.