Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
aiskillstore avatar

Desmos Graphing

aiskillstore/marketplace

  • 1 installs
  • 404 repo stars
  • Updated August 5, 2026
  • aiskillstore/marketplace

desmos-graphing is a Claude skill that creates interactive Desmos graphs in Obsidian using desmos-graph code blocks.

About

This skill creates interactive Desmos graphs in Obsidian using desmos-graph code blocks. It explains the plugin's dual parser (mathjs in settings, Desmos LaTeX in equations, plain math in restrictions), the code block format, styling pipes, and supported equation types. A developer or note-taker uses it to visualize functions, curves, and inequalities inside Obsidian notes.

  • Creates interactive Desmos graphs inside Obsidian using desmos-graph code blocks
  • Documents the dual-parser system: mathjs for settings, Desmos LaTeX for equations
  • Covers explicit, implicit, parametric, polar, piecewise, and point equation types

Desmos Graphing by the numbers

  • 1 all-time installs (skills.sh)
  • Ranked #1,366 of 1,879 Documentation skills by installs in the Skillselion catalog
  • Data as of Aug 5, 2026 (Skillselion catalog sync)
At a glance

desmos-graphing capabilities & compatibility

Free; runs inside the Obsidian Desmos plugin, no API keys.

Capabilities
math visualization · graph authoring · obsidian note authoring
Works with
obsidian
Runs
Runs locally
Pricing
Free
From the docs

What desmos-graphing says it does

Create interactive Desmos graphs in Obsidian using desmos-graph code blocks.
SKILL.md
The plugin uses **different parsers** for different parts:
SKILL.md
npx skills add https://github.com/aiskillstore/marketplace --skill desmos-graphing

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs1
repo stars★ 404
Last updatedAugust 5, 2026
Repositoryaiskillstore/marketplace ↗

What it does

Author interactive Desmos math graphs inside Obsidian markdown notes.

When should I use this skill?

When visualizing functions, parametric curves, inequalities, or mathematical relationships in Obsidian.

What you get

A correctly formatted desmos-graph code block that renders in Obsidian.

  • a desmos-graph code block

By the numbers

  • 4 parser contexts documented (settings, equations, points, restrictions)
  • 7 equation types listed
  • default graph width 600 and height 400 pixels

Files

SKILL.mdMarkdownGitHub ↗

Desmos Graphing in Obsidian

⚠️ CRITICAL: Dual Parser System

The plugin uses different parsers for different parts:

LocationParserpisqrtExample
Settingsmathjspi-left=-2*pi+0.5
EquationsDesmos (LaTeX)\pi\sqrt{x}y=\sqrt{x}+\pi
PointsDesmos (LaTeX)\pi\sqrt{x}(\pi/2, 1)
Restrictionsplain mathnumericx^0.5x>-1.5708
✅ CORRECT
left=-0.5; right=2*pi+0.5
---
y=\sqrt{x}|blue
y=x/\sqrt{3}|green|0<=x<=3^0.5
(\pi/2, 0)|label:cos(90°)=0

❌ WRONG (will error)
left=-2*\pi               # Error: "Syntax error in part '\pi'"
y=\sin(x+pi/4)            # Error: "Too many variables" (p*i)
(pi/2, 0)                 # Error: "Too many variables" ← Points need LaTeX!
y=x/sqrt(3)|0<=x<=sqrt(3) # Error: "Too many variables" (s*q*r*t)

Key rule: \sqrt{x} in equations, x^0.5 in restrictions!

Code Block Format

````markdown

[settings]
---
[equations]

````

  • Settings (optional) above ---, equations below
  • Each equation on its own line
  • Use | to add styling/restrictions to equations

Quick Start

Basic Function

````markdown

y=x^2
y=\sin(x)|blue

````

With Settings

````markdown

left=-2*pi; right=2*pi
bottom=-2; top=2
---
y=\sin(x)|red
y=\cos(x)|blue|dashed

````

Points and Labels

````markdown

(0, 0)|label:Origin
(3, 4)|red|label:Point A
(\pi/2, 1)|blue|label:π/2    # Use \pi in coordinates!
y=x|dashed

````

⚠️ Points use LaTeX: (\pi/2, 0) not (pi/2, 0)

Essential Settings

SettingDefaultDescription
width600Graph width in pixels
height400Graph height in pixels
left-10Left boundary
right10Right boundary
bottom-7Bottom boundary
top7Top boundary
gridtrueShow grid lines
degreeModeradiansradians or degrees

Additional Settings

SettingDefaultDescription
hideAxisNumbersfalseHide axis number labels
xAxisLabel-Custom x-axis label
yAxisLabel-Custom y-axis label
xAxisLogarithmicfalseLogarithmic x-axis scale
yAxisLogarithmicfalseLogarithmic y-axis scale
defaultColor-Default color for all equations

Settings use = for values, separated by ; or newlines. Bounds accept math expressions: left=-2*pi

Equation Styling

Use | (pipe) to add styling after an equation:

equation|color|style|restrictions|label

Segment order is flexible - the parser auto-detects each segment type.

⚠️ CRITICAL: `|` is RESERVED as delimiter!

The pipe character cannot appear in equations or labels:

(1, 0)|label:|v|=5         # ❌ Error: label parsed as empty
(1, 0)|label:∥v∥=5         # ✅ Use Unicode ∥ (U+2225)
y=|x|                      # ❌ Error: pipes split the equation
y=abs(x)                   # ✅ Use abs() function

Colors

Supported names: red, green, blue, yellow, orange, purple, cyan, magenta, black, white

Hex codes: #rrggbb or #rgb (e.g., #ff6600, #f60)

⚠️ `gray`/`grey` are NOT supported! Use hex instead:

  • Light gray: #c0c0c0
  • Medium gray: #808080
  • Dark gray: #404040
y=x|gray           # ❌ Error: parsed as restriction
y=x|#808080        # ✅ Correct

Line & Point Styles

LinePointEffect
solidpointDefault (solid/filled)
dashedopenDashed/open circle
dottedcrossDotted/X mark

Labels

(1, 2)|label shows "(1, 2)", (1, 2)|label:Point A shows custom text

Restrictions

Limit where equations are drawn:

y=x^2|0<x<5           # Only draw for 0 < x < 5
y=\sin(x)|x>0|y>0     # Multiple restrictions
y=2x|0<=x<=1          # <= and >= supported
y=\tan(x)|x>-1.5708|x<1.5708   # Use numeric values (π/2≈1.5708)

⚠️ CRITICAL: Use plain math, NOT LaTeX in restrictions!

✅ Correct❌ WrongWhy
x/2<y\frac{x}{2}<yNo LaTeX commands
x^0.5<2\sqrt{x}<2Use ^0.5 not \sqrt
0<x<3^0.50<x<sqrt(3)sqrt() → sqr*t
x>-1.5708x>-pi/2pi → p*i, use numeric
0<x<1\{0<x<1\}No braces needed

The plugin auto-wraps restrictions with {} - don't add them yourself.

Hidden & Special Tags

f(x)=x^2|hidden       # Define but don't display
y=f(x)+1              # Use the hidden function
y=\sin(x)|noline      # Points only, no connecting line

Combining Styles

Order doesn't matter:

y=x^2|red|dashed|0<x<5
(1, 2)|open|blue|label:Start

Equation Types

TypeExample
Explicity=x^2
Implicitx^2+y^2=25
Parametric(\cos(t), \sin(t))
Polarr=1+\cos(\theta)
Piecewisey=\{x<0: -x, x\}
Point(3, 4)
Function deff(x)=x^2

⚠️ Polar Equations Must Be Linear in r

Desmos only supports polar equations where r appears linearly:

r=1+\cos(\theta)       # ✅ Linear in r
r^2=\cos(2\theta)      # ❌ Error: "must be linear in r"

Solution: Convert to parametric curve:

# Lemniscate (r² = cos(2θ)) → parametric form
(\cos(t)\sqrt{\cos(2t)}, \sin(t)\sqrt{\cos(2t)})|blue

Parametric Curves Warning

⚠️ Expand parenthetical expressions to avoid parsing errors:

(2t, 4t(1-t))|blue     # ⚠️ May be misinterpreted as piecewise
(2t, 4t-4t^2)|blue     # ✅ Expanded form is safer

Piecewise Functions

⚠️ Escape curly braces with backslash:

y={x<0: -x, x}         # ❌ Error
y=\{x<0: -x, x\}       # ✅ Correct

Complete Examples

Trigonometric Phase Shifts

````markdown

left=-2*pi; right=2*pi
bottom=-2; top=2
---
y=\sin(x)|blue
y=\sin(x+\pi/4)|red
y=\sin(x+\pi/2)|green
y=\sin(x+\pi)|purple|dashed

````

Bezier Curve with Control Points

````markdown

left=-0.5; right=2.5
bottom=-0.5; top=2.5
---
(2t, 4t-4t^2)|blue
(0, 0)|black|label:P0
(1, 2)|black|label:P1
(2, 0)|black|label:P2
y=2x|#808080|dashed|0<x<1
y=-2x+4|#808080|dashed|1<x<2

````

Easing Functions

````markdown

left=-0.2; right=1.2
bottom=-0.2; top=1.2
---
y=x|dashed|black
y=1-\cos(\pi*x/2)|blue|0<=x<=1
y=\sin(\pi*x/2)|red|0<=x<=1

````

Cosine with Special Points

````markdown

left=-0.5; right=2*pi+0.5
bottom=-1.5; top=1.5
---
y=\cos(x)|blue
(0, 1)|red|label:cos(0)=1
(\pi/2, 0)|red|label:cos(π/2)=0
(\pi, -1)|red|label:cos(π)=-1
(3*\pi/2, 0)|red|label:cos(3π/2)=0

````

⚠️ Note: Settings use 2*pi, points use \pi, 3*\pi/2, etc.

Advanced

For complete documentation, see reference.md:

  • All 13 settings with defaults and auto-adjustment rules
  • Hex codes for unsupported colors (gray, pink, brown, etc.)
  • 13 error messages with causes and fixes
  • Detailed troubleshooting for common issues
  • Polar-to-parametric conversion examples

Related skills

open.feishu.cnLark MarkdownInstantly turn any markdown file into clean, formatted Lark/Figma-compatible documents without manual reformatting.488klarksuiteLark DocCreate, read, update, summarize, rewrite and manage Feishu/Lark cloud documents directly from agent workflows.401k16.1klarksuiteLark WikiCreate, organize, query, and manage documents, spaces, and members inside Lark (Feishu) knowledge bases directly from AI agent workflows.397k16.1kmattpocockDomain ModelingBuild and sharpen a project's domain model: pin down domain terminology in a glossary and record architectural decisions as ADRs.318k202kxixu-meOpensource Guide CoachGet expert, attribution-safe guidance on launching and sustaining an open-source project.270k71xixu-meReadme I18nMaintain consistent, updatable language selector blocks across every README variant in a multilingual repository.270k71

FAQ

Why does my equation error with pi?

Equations use Desmos LaTeX so pi must be written as \pi; plain 'pi' is parsed as p*i.

Can I use gray as a color?

No, gray and grey are not supported; use a hex code like #808080 instead.

Documentationnotes
Browse by category
AI & AgentsFrontend & DesignBackend & DataDev ToolsAutomationTesting & ReviewSecurityMonitoring & CloudDocs & Planning
Design & frontend
Design systemsAnimation & motionAccessibility (a11y)CSS & TailwindUI designUXDesign to codeshadcn/uiLanding pagesBest design skills
Most searched skills
find-skillscavemanfrontend-designbrainstormingsystematic-debuggingstop-slopemil-design-engui-ux-pro-maxkarpathy-guidelinesweb-design-guidelinesreact-best-practicesgrill-meimprovemicrosoft-foundryagent-browser
Browse all listings
All agent skillsAll MCP serversAll marketplacesAll plugins

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.