LedgerIt
ProductHow it worksSecurityFeaturesPricingBlogChangelogDocs
Sign inSign up

Getting started

  • Introduction

Foundations

  • Colors
  • Typography
  • Materials
  • Motion
  • Illustrations

Components

  • Overview

LedgerIt

  • Button
  • Badge
  • Amount
  • Card
  • StatGrid
  • LineRow
  • BrandMark
  • Logo
  • HighlightedCode
  • ActivityHeatmap

Actions

  • ButtonGroup
  • Toggle
  • ToggleGroup
  • Kbd

Forms

  • Field
  • Input
  • InputGroup
  • Textarea
  • EditableText
  • EditableDate
  • EditableSelect
  • SecretInput
  • Select
  • Combobox
  • Autocomplete
  • Checkbox
  • RadioGroup
  • Switch
  • Slider
  • DatePicker
  • Calendar
  • InputOTP

Overlays

  • Dialog
  • AlertDialog
  • useConfirm
  • Sheet
  • Drawer
  • Popover
  • HoverCard
  • RecordPreviews
  • Tooltip

Menus

  • DropdownMenu
  • RowActions
  • ContextMenu
  • Menubar
  • Command

Navigation

  • Tabs
  • Breadcrumb
  • Pagination
  • NavigationMenu

Data display

  • Table
  • Item
  • Row
  • ReorderableList
  • Avatar
  • Empty
  • Accordion
  • Collapsible
  • Overline
  • AspectRatio
  • Carousel

Feedback

  • Alert
  • toast
  • Progress
  • Skeleton
  • Spinner

Layout

  • Separator
  • ScrollArea
  • ResizablePanelGroup
  • PageHeader
  • SectionHeader

Messaging

  • Bubble
  • MessageScroller
  • Introduction
  • Colors
  • Typography
  • Materials
  • Motion
  • Illustrations
  • Components

Forms

Input

A 32px text control with the input edge, the accent focus halo and the destructive error state, shared with every other text control through one recipe. Placeholders show an example, never the label.

Example

This invoice number is already in the books.
import { Input } from "@/components/ui/input"
PreviousFieldNextInputGroup
© 2026 LedgerLift Inc, dba LedgerIt. All rights reserved.

Made with love by PhDs and Y Combinator alumni

MissionPricingBlogChangelogDocsDesign systemPrivacyTerms