# Sygnal Webflow Components ## Sygnal Components - [Sygnal Components](https://sygnal.gitbook.io/sygnal-webflow-components/sygnal-components.md) - [Legacy Notes](https://sygnal.gitbook.io/sygnal-webflow-components/sygnal-components/legacy-notes.md) - [Technical Notes](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes.md) - [Native Components](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/native-components.md) - [Code Components](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components.md) - [Deployment](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/deployment.md) - [Using Claude Code](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/using-claude-code.md) - [Technical Notes](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/technical-notes.md) - [Retrieving RichText HTML](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/technical-notes/retrieving-richtext-html.md) - [Code Component SSR](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/technical-notes/code-component-ssr.md) - [Working with Slotted Content](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/technical-notes/working-with-slotted-content.md) - [How CC's Render](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/technical-notes/how-ccs-render.md) - [Development Techniques](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/development-techniques.md) - [Marketplace](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/marketplace.md) - [Library Versioning](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/marketplace/library-versioning.md) - [Github Protocol](https://sygnal.gitbook.io/sygnal-webflow-components/technical-notes/code-components/marketplace/github-protocol.md) - [Element Types](https://sygnal.gitbook.io/sygnal-webflow-components/element-types.md) - [Current Thoughts](https://sygnal.gitbook.io/sygnal-webflow-components/current-thoughts.md) - [Designer Gaps](https://sygnal.gitbook.io/sygnal-webflow-components/designer-gaps.md) - [Boolean Attributes](https://sygnal.gitbook.io/sygnal-webflow-components/designer-gaps/boolean-attributes.md) - [About Sygnal's Dev Process](https://sygnal.gitbook.io/sygnal-webflow-components/about-sygnals-dev-process.md) - [Future](https://sygnal.gitbook.io/sygnal-webflow-components/future.md) - [Overview](https://sygnal.gitbook.io/sygnal-webflow-components/cc/overview.md) - [Installing Code Components](https://sygnal.gitbook.io/sygnal-webflow-components/cc/installing-code-components.md): How to Install Code Components using Sygnal Marketplace. - [Technical Notes](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes.md) - [Sygnal's Code Components Development Framework](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-components-development-framework.md) - [Identifying Test Components](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-components-development-framework/identifying-test-components.md) - [Feature Branches](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-components-development-framework/feature-branches.md) - [Updates to Build Scripts](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-components-development-framework/updates-to-build-scripts.md) - [Proof of Concept Work](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/proof-of-concept-work.md) - [Sygnal's Code Component Dev Approach](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-component-dev-approach.md) - [Legacy Approach](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-component-dev-approach/legacy-approach.md) - [Production Deployment](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/sygnals-code-component-dev-approach/production-deployment.md) - [R\&D Planned](https://sygnal.gitbook.io/sygnal-webflow-components/cc/technical-notes/r-and-d-planned.md) - [Sygnal Remotion](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-remotion.md) - [Setup](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-remotion/setup.md) - [Process](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-remotion/process.md) - [Sygnal Media](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media.md) - [Rive ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/rive.md) - [Rive JS API](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/rive/rive-js-api.md) - [Flipbook ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/flipbook.md): A mouse-controlled image sequencer. - [Background Video ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/background-video.md): A simple background video player with some cool enhancements. - [Spline ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/spline.md) - [Audio (Waveform) ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-waveform.md) - [Styling](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-waveform/styling.md) - [Waveform Data](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-waveform/waveform-data.md): Speed up waveform data by pre-loading it - [Technical Notes](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-waveform/technical-notes.md) - [Media Players](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-waveform/media-players.md) - [Future & Design Inspo](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-waveform/future-and-design-inspo.md) - [Legacy](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-waveform/legacy.md) - [360 Image](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/360-image.md): View 360 Images - [Textured Image](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/textured-image.md) - [Picture](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/picture.md) - [Video](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/video.md) - [Audio (Plyr)](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-media/audio-plyr.md): Plyr.js-based variation of the Audio component. - [Sygnal SEO](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-seo.md): Manage your JSON-LD easily using Webflow Code Components. - [Website JSON-LD ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-seo/website-json-ld.md) - [Organization JSON-LD ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-seo/organization-json-ld.md) - [Video JSON-LD ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-seo/video-json-ld.md) - [Job Posting JSON-LD ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-seo/job-posting-json-ld.md) - [FAQ JSON-LD ⏸️](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-seo/faq-json-ld.md) - [Sygnal Layout](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout.md) - [DataTable ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/datatable.md) - [Masonry ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/masonry.md): A masonry grid designed specifically for image layouts. - [Grid ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/grid.md) - [Rich Text Repeater ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/rich-text-repeater.md): Transforms Webflow Rich Text content into structured layouts. - [Hierarchy ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/hierarchy.md): Transforms elements and collection list content into hierarchical form. - [Show More ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/show-more.md): Constrain lengthy content areas behind a Show more button. - [Slider](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/slider.md) - [Modals](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/modals.md) - [Smartgrid](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/smartgrid.md) - [Lightbox](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/lightbox.md) - [DarkMode](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/darkmode.md): Switch dark mode and light mode automatically. - [Tabcordion](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/tabcordion.md) - [Table](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-layout/table.md): Static and CMS-driven tables, including responsive support. - [Sygnal Maps](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps.md) - [Google Map ( Simple ) ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps/google-map-simple.md): A streamlined Google Maps integration component. - [Map Image](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps/map-image.md): Present a map based on an equirectangular map projection, with overlaid lat-lon Pins - [Google Map](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps/google-map.md) - [Mapbox Map](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps/mapbox-map.md) - [MapLibreGL Map](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps/maplibregl-map.md) - [Leaflet Map](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps/leaflet-map.md) - [Sygnal Components](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components.md): General-purpose code components to support your Webflow designs. - [Script Manager ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/script-manager.md) - [QRCode ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/qrcode.md) - [Css Isolation ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/css-isolation.md): Perform Isolated CSS changes on slotted components. - [Inline SVG Icon ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/inline-svg-icon.md) - [VCard ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/vcard.md) - [Countdown Timer ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/countdown-timer.md): A simple countdown timer for marketers, to manufacture urgency. - [Color Swatch ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/color-swatch.md): A useful color swatch, for branding kits - [Embed ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/embed.md): Mutates Embed content to expand custom macros with attribute or component property values. - [Switch](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/switch.md) - [Charts & Graphs](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-components/charts-and-graphs.md) - [Sygnal Forms](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms.md) - [Country Code Selector ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/country-code-selector.md): Deliver nicely styled country code selection in your forms. - [Image Upload ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/image-upload.md): Upload images with a full user-cropping UX to get that perfect profile photo. - [Image Upload Technical Notes](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/image-upload/image-upload-technical-notes.md) - [Toggle Checkbox ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/toggle-checkbox.md): A toggle switch-style checkbox. - [Checkbox Technical Notes](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/toggle-checkbox/checkbox-technical-notes.md) - [Form File Upload](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/form-file-upload.md) - [TextArea](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/textarea.md) - [Custom Checkbox](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/custom-checkbox.md) - [Custom Radiobutton](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/custom-radiobutton.md) - [Range Slider](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/range-slider.md) - [Technical Notes](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-forms/technical-notes.md) - [Sygnal ECommerce](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-ecommerce.md) - [Sygnal User Accounts](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-user-accounts.md) - [Sygnal Globe](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-globe.md) - [Globe](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-globe/globe.md) - [Vertex Earth ✅](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-globe/vertex-earth.md): A stylized globe, with no useful function. - [Experimental](https://sygnal.gitbook.io/sygnal-webflow-components/cc/experimental.md) - [Instagram Feed ⏸️](https://sygnal.gitbook.io/sygnal-webflow-components/cc/experimental/instagram-feed.md) - [Merged Collection List ⏸️](https://sygnal.gitbook.io/sygnal-webflow-components/cc/experimental/merged-collection-list.md) - [Native Components ( NC's )](https://sygnal.gitbook.io/sygnal-webflow-components/nc/native-components-ncs.md) - [NC Design Approach](https://sygnal.gitbook.io/sygnal-webflow-components/nc/native-components-ncs/nc-design-approach.md) - [Structure](https://sygnal.gitbook.io/sygnal-webflow-components/nc/structure.md) - [Section](https://sygnal.gitbook.io/sygnal-webflow-components/nc/structure/section.md) - [Container](https://sygnal.gitbook.io/sygnal-webflow-components/nc/structure/container.md) - [Quick Stack](https://sygnal.gitbook.io/sygnal-webflow-components/nc/structure/quick-stack.md) - [V Flex](https://sygnal.gitbook.io/sygnal-webflow-components/nc/structure/v-flex.md) - [H Flex](https://sygnal.gitbook.io/sygnal-webflow-components/nc/structure/h-flex.md) - [Page Slot](https://sygnal.gitbook.io/sygnal-webflow-components/nc/structure/page-slot.md) - [Basic](https://sygnal.gitbook.io/sygnal-webflow-components/nc/basic.md) - [Div Block](https://sygnal.gitbook.io/sygnal-webflow-components/nc/basic/div-block.md) - [List](https://sygnal.gitbook.io/sygnal-webflow-components/nc/basic/list.md): Represents a \