An advanced and versatile marine instrumentation package to display Signal K data.
npm install @mxtommy/kipKIP is the most popular Signal K MFD and marine instrument panel: plug-and-play, touch-optimized, pre-installed, and ready-to-use across all devices.
Unlike many instrument panels, KIP offers full MFD functionality and is automatically included with Signal K distributions, so there’s nothing extra to install or configure. Simply start your Signal K server, open KIP in a browser, and it’s ready to go. A single instance works everywhere — no per‑device deployment is needed.
KIP is designed for sailors and boaters who want:
- A ready-to-use, classic marine app experience with minimal setup.
- A modern, polished interface optimized for marine displays.
- Touch-optimized design: touch-first, intuitive design for tablets, phones, and other touch-enabled devices.
- Cross-platform support: runs on phones, tablets, laptops, Raspberry Pi, Web Enabled TV or other fixed displays - anywhere you can run a web browser.
- Instant access to all Signal K data: displays gauges, charts, switches, and other widgets right out of the box.
- Flexible dashboards: customize layouts, drag-and-drop widgets, night/day mode, kiosk/fullscreen and remote control support.
With KIP, you get the familiar feel of professional Multi-Function Displays combined with the flexibility of Signal K. It’s simple, reliable, and highly usable — the ultimate ready-to-go, modern, touch-first, Multi-Function Display for Signal K vessels.
!KIP
- Full-Screen Utilization: Ensure the display uses the entire screen without requiring scrolling, maximizing visibility, usability reducing onscreen control clutter.
- Optimized for Readability: Present data in a large, clear, and easily interpretable format to ensure quick comprehension. Utilize high-contrast color schemes to enhance visibility, especially in bright daylight conditions.
- Touchscreen Excellence: Deliver an intuitive and seamless experience for touchscreen users, with support for gestures like swiping and tapping.
- Cross-Device Compatibility: Guarantee a consistent and responsive experience across phones, tablets, computers, and other devices.
- Modern Browser Support: Include support for the latest versions of Chromium and other modern web browsers to ensure optimal performance and compatibility.
Sidenav for quick access to all important features.
!Sidenav Dashboard Access
Chartplotter Mode with dashboards
!Chartplotter Mode
Add, resize, and position the widgets of your choosing. Need more? Add as many additional dashboards as you wish to keep your display purposeful. Simply swipe up and down to quickly cycle through dashboards or effortlessly jump between dashboards with a single tap in the action sidenav, always knowing exactly where you are thanks to clear highlighting of your current dashboard.
Widget lists are sorted by category.
!Layouts Configuration Image
Intuitive widget configuration.
!Gauges Configuration Image
See what Signal K has to offer that you can leverage with widgets. Select it and tweak the display options to suit your purpose.
!Paths Configuration Image
Many units are supported. Choose your preferred app defaults, then tweak them widget-by-widget as necessary. KIP will automatically convert the units for you.
!Units Configuration Image
Organize your dashboards and access tools.
!Options and Dashboards
Get the latest version of KIP to see what's new!
Various other types of widgets
!Electrical Concept Image
Freeboard-SK Chartplotter integration with Autopilot widget
!Freeboard-SK Image
Grafana integration with other widgets
!Embedded Webpage Concept Image
Use cases
- Mast display: change dashboards from the cockpit.
- Wall/helm screens: toggle dashboards without standing up or reaching for controls.
- Non‑touch/no input: select dashboards when no keyboard/mouse is connected or touch is not supported/disabled.
Navigation & Charting
- Freeboard‑SK (pre-installed) – Multi‑station, web chart plotter dedicated to Signal K: routes, waypoints, charts, alarms, weather layers, and instrument overlays.
Visual Flow / Automation
- Node‑RED – Low‑code, flow‑based wiring of devices, APIs, online services, and custom logic (alert escalation, device control automation, data enrichment, protocol bridging).
Data Storage & Analytics
- InfluxDB / other TSDB – High‑resolution historical storage of sensor & performance metrics beyond what lightweight widget charts should retain.
- Grafana – Rich exploratory / comparative dashboards, ad‑hoc queries, alert rules on stored metrics, correlation across heterogeneous data sources.
What KIP deliberately IS NOT trying to become:
- A full data lake / long‑term time‑series historian.
- A general purpose automation / rules / orchestration engine.
- A universal external web‑app embedding or mash‑up framework.
- A low‑code integration hub for arbitrarily wiring protocols and services.
Those domains already have excellent, specialized open‑source tools. Instead of re‑implementing them, KIP plays nicely alongside them within a Signal K based onboard stack.
#### Signal K Plugins
Domain‑specific enrichment (polars, performance calculations, derived environmental data, routing aids) published directly into the Signal K data model that KIP can then display.
#### KIP Widgets
Visual data representation component that use Signal K path data and API V2 features. Scaffolding a new widgets only takes a few moments and is backed by KIP AI agent instructions providing willed creative minds a personal assistant programmer.
Run one simple command (example):
``
npm run generate:widget
or ask your AI to create a widget using the KIP project AI instructions.
For deeper details you can still look at COPILOT.md, but you don’t need to in order to get started.
Keeping KIP focused preserves responsiveness (lower CPU / memory), reduces UI clutter, and accelerates core sailing user experience development. Heavy analytics, complex workflow logic, and broad third‑party embedding stay where they are strongest—outside—but still feed KIP through the common Signal K data fabric.
In short: use KIP to see & act on live sailing information; use the complementary tools to store it long‑term, analyze it deeply, automate decisions, or build advanced integrations.
Linux, Mac, RPi, or Windows dev platform supported
1. Download your favorite coding IDE (we use the free Visual Studio Code)
2. Create your own GitHub KIP fork.
3. Configure your IDE's source control to point it to your forked KIP instance (Visual Studio Code, GitHub support is built-in) and get the fork's master branch locally.
4. Install npm and node. On macOS, you can use brew install node if you have Homebrew. See https://nodejs.org/en/download for more options.npm install -g @angular/cli
5. Install the Angular CLI using
Project Setup
1. From your fork's master branch, create a working branch with a name such as: new-widget-abc or fix-issue-abc, etc.npm install
2. Check out this new branch.
3. In a command shell (or in the Visual Studio Code Terminal window), go to the root of your local project folder, if not done automatically by your IDE.
4. Install project dependencies using the NPM package and dependency manager: run . NPM will read the KIP project dependencies, download, and install everything automatically for you.npm run build:all
5. Build the app locally using Angular CLI: from that same project root folder, run . The CLI tool will build KIP.
Code and Test
1. Fire up your local KIP development instance with npm run dev.http://localhost:4200/@mxtommy/kip
2. Hit Run/Start Debugging in Visual Studio Code or manually point your favorite browser to . Alternatively, to start the development server and allow remote devices connections, such as with your phone or RPi (blocked for security reasons by default): ng serve --configuration=dev --serve-path=/@mxtommy/kip/ --host=
3. Voila!
As you work on source code and save files, the app will automatically reload in the browser with your latest changes.
You will also need a running Signal K server for KIP to connect to and receive data. You could also use https://demo.signalk.org but without authentication enabled, your actions, features and test coverage will be limited.
Apple PWA Icon Generation
Use the following tool and command line:
npx pwa-asset-generator ./src/assets/favicon.svg ./src/assets/ -i ./src/index.html -m ./src manifest.json -b "linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.15) 100%), radial-gradient(at top center, rgba(255,255,255,0.40) 0%, rgba(0,0,0,0.40) 120%) #989898" -p 5%
Share
Once done with your work, from your fork's working branch, make a GitHub pull request to have your code reviewed, merged, and included in the next release. It's always optimal to sync with us prior to engaging in extensive new development work.
For comprehensive development guidance, please refer to these instruction files:
for KIP-specific architecture and patterns.
2. Angular Standards: Follow .github/instructions/angular.instructions.md for modern Angular development.
3. Setup & Build: Use this README for project setup and build commands.$3
- Widget Development: Use the Host2 widget pattern (signals + directives) and scaffold new widgets with the create-host2-widget schematic (see COPILOT.md).
- Angular Patterns: Use signals, standalone components, and modern control flow.
- Theming: Follow KIP's theme system for consistent UI.
- Code Quality: Run npm run lint` before commits.KIP is open-source under the MIT license, built by the community and 100% free. Join the community on Discord or contribute to the project on GitHub!