Importing Modules and Chips
Running tscircuit
- Building a Static Site:
tsci build --sitepackages your tscircuit project into a static website that anyone can browse without running a server. - Connect GitHub Repositories to tscircuit: Link your project repo to tscircuit for automatic previews and publishing
- Displaying Circuit JSON on a Webpage: Render Circuit JSON in web apps using RunFrame and related components
- Platform Configuration: The Platform Configuration allows you to change tscircuit behavior to best suit the platform the tscircuit code is running on.
- Programmatically Building Circuits: Use tscircuit libraries and APIs to generate circuits from scripts or services
- Running tscircuit inside an iframe: tscircuit can be evaluated inside an iframe. This makes it easy to embed snippets on a webpage without complex build systems.
- Running tscircuit with a script tag: Load
tscircuit's browser build from a CDN and render a circuit written inside a<script type="tscircuit-tsx">block – no build tooling required. - Using tscircuit without React: Explore current options for running tscircuit outside of a React environment
Circuit Generation
TypeScript Guide
tscircuit Essentials
- Essential Elements: There are some essential elements you'll need for almost every circuit you make, this doc gives a brief overview of each of them so you can jump right in and get started building electronics!
- Configuring Chips: Walk through configuring
<chip />components, from defining pin labels and footprints to wiring reusable chip abstractions. - Automatic PCB Layout: Explore tscircuit's automatic PCB layout engines: pcbFlex, pcbGrid, and pcbPack, and learn how to choose the right approach for arranging components quickly.
- Automatic Schematic Layout: Understand how the default schematic autolayout arranges components and discover options for nudging results with manual edits and layout helpers.
- Using Layout Properties: There are many ways to layout your schematic and PCB with tscircuit including automatic layout and manual edits. In this article we'll discuss how to programmatically lay out a board using layout properties like
schX/schYandpcbXandpcbY - Manual Edits: Learn how to capture drag-and-drop adjustments in
manual-edits.json, use the schematic and PCB editors to create them, and troubleshoot when changes don't apply. - Pinout SVG: Generate shareable pinout diagrams by annotating components with
pinAttributesand exporting the interactive SVG view. - Port and Net Selectors: Learn how to target ports, nets, and components with selector strings, and see practical examples for traces and component props.
- tscircuit.config.json: Configure your tscircuit project settings
- Using Expressions for Component Values: Use JavaScript expressions inside circuits to derive component values that react to other parameters, like voltage dividers or tuned filters.
- Using Groups for PCB Layout: Groups can help you break up your layout problem into smaller, more manageable and reusable parts.
- Using "sel" References: Reference components, pins, and modules with the type-safe
selhelper and learn when to use conventional selectors or component-aware lookups.
Understanding Fabrication Files
Fabrication files are files that can be uploaded to a fabricator or turn-key manufacturer to get an entire circuit board made. tscircuit includes three main types of files inside our fabrication files zip: