Back to Plugins
Prototype Note Toggle

Prototype Note Toggle

Click-to-expand notes inside your prototype, auto-wired and synced to a spec panel.

Plugin Preview

Prototype Note Toggle preview

About this plugin

Drop interactive toggle notes inside your Figma frames. Each note is a collapsible component — in Present (prototype) mode, click the badge to reveal the full description, and click again to collapse. Every prototype interaction is wired for you, automatically.No more sticky notes cluttering your design. No more manually building open/closed variants and click interactions. No more keeping a separate spec doc in sync by hand.✨ Features• Click-to-expand annotations — numbered badges that open a description bubble on click in Present mode• Auto-wired interactions — open/closed variants + ON_CLICK toggles are created for you• Bubble direction — top-left / top-right / bottom-left / bottom-right• Generate Summary — compile all notes in a frame into a clean spec panel• Two-way live sync — in Live mode, edit a note or the panel and the other updates itself🚀 How to use1. Drop a note inside a frame. • In an Auto Layout frame, select the note and turn on “Ignore auto layout” so it stays exactly where you place it.2. With the notes inside the frame, click Generate Summary to build the spec panel.3. Switch the panel to Live mode for real-time two-way sync between the panel and your note descriptions. • Tip: you don’t have to keep dropping new notes — duplicate one and just edit the text.💡 Good to know• Edit the text content only. Changing a note’s font/color, or using Figma’s auto-formatting (typing “- ” for bullets, number + space for lists), won’t be picked up by sync — write lists as plain text.• Live sync runs while the plugin is open (Figma plugins stop when closed).It’s free, and still actively improving — your feedback is very welcome 🙏------------Figma 프레임 안 어디든 ‘클릭하면 펼쳐지는’ 토글 주석을 떨어뜨리세요. 각 노트는 접히는 컴포넌트라, Present(프로토타입) 모드에서 뱃지를 클릭하면 설명이 펼쳐지고 다시 누르면 접힙니다. 열림/닫힘 인터랙션은 플러그인이 자동으로 연결해 줍니다.캔버스를 어지럽히는 스티키 노트도, 열림/닫힘 variant와 클릭 인터랙션을 일일이 거는 수고도, 따로 만든 스펙 문서를 손으로 맞추는 일도 이제 그만.✨ 주요 기능• 클릭하면 펼쳐지는 주석 — 번호 뱃지를 Present 모드에서 클릭하면 설명 말풍선이 열림• 인터랙션 자동 연결 — 열림/닫힘 variant + ON_CLICK 토글을 자동 생성• 말풍선 방향 — 좌상 · 우상 · 좌하 · 우하• Generate Summary — 프레임 안 주석을 모아 정리(스펙) 패널로 컴파일• 양방향 실시간 동기화 — Live 모드에서 노트나 패널 한쪽만 고쳐도 양쪽 자동 반영🚀 사용법1. 노트를 프레임 안에 떨어뜨립니다. • 오토레이아웃 프레임이면, 노트를 선택하고 ‘Ignore auto layout’을 켜면 원하는 위치에 그대로 고정됩니다.2. 노트를 프레임 안에 둔 채로 Generate Summary를 누르면 스펙 패널이 생성됩니다.3. 패널을 Live 모드로 전환하면 패널 ↔ 노트 설명이 실시간 양방향 동기화됩니다. • 팁: 매번 새 노트를 만들지 않아도 돼요 — 복제해서 내용만 바꿔 쓰세요.💡 알아두면 좋아요• 텍스트는 ‘내용만’ 수정하세요. 노트의 폰트·색을 바꾸거나 Figma 자동 서식(‘- ’로 불릿, 숫자+스페이스로 목록)을 쓰면 동기화에 반영되지 않습니다 — 목록은 일반 텍스트로 작성해 주세요.• Live 동기화는 플러그인이 켜져 있는 동안 작동합니다 (Figma 플러그인은 닫으면 멈춥니다).무료입니다. 계속 다듬고 있으니 피드백 주시면 정말 감사하겠습니다 🙏

Plugin Details

Version18
CreatedMarch 14, 2026
Last UpdatedJune 21, 2026
CategoryPrototyping & animation plugins
Creatorkippeum
Stats10 installs, 2 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://cdn.jsdelivr.net
    • https://fonts.googleapis.com
    • https://fonts.gstatic.com