Refined component renderer packages built on the FroggDesign visual language.
EnterUI turns the FroggDesign visual language into production-ready component packages for dashboards, SaaS apps, internal tools, and product interfaces. React is the primary renderer, with a SolidJS renderer for stateless and presentational primitives.
Applications consume public package exports only. Import theme CSS once, then the renderer CSS.
The sidebar groups components by task, with basic building blocks before advanced workflows. Previous and Next follow the same order.
pnpm install @froggdesign/enter-ui-react @froggdesign/themeimport "@froggdesign/theme/styles.css";
import "@froggdesign/enter-ui-react/styles.css";SolidJS apps use @froggdesign/enter-ui-solid and
@froggdesign/enter-ui-solid/styles.css. See
SolidJS for current coverage.
Button, IconButton, Link, Card, Badge, Text, List, Alert, Avatar, Separator, Tabs, Accordion, Disclosure, and copy-friendly primitives for polished product surfaces.
Form, Field, Fieldset, ValidationSummary, Input, CurrencyInput, MaskedInput, URLInput, Select, Combobox, MultiSelect, TagsInput, DatePicker, CronInput, RecurrenceEditor, and scheduling controls.
Table, DataTable, DataGrid, SavedViews, SortMenu, DensityToggle, ColumnVisibilityMenu, BulkEditPanel, FilterBuilder, KanbanBoard, TransferList, and operational table utilities.
AppShell, Header, Sidebar, SideNav, NavigationRail, WorkspaceSwitcher, AppSwitcher, PageLayout, SplitView, PageHeader, Toolbar, Breadcrumb, and navigation primitives.
Toast, Banner, Progress, Spinner, Skeleton, EmptyState, LiveRegion, Announcer, ActivityTimeline, ReleaseStepper, AgendaList, and audit-friendly workflow components.
MetricCard, ComparisonMetric, TrendIndicator, Meter, Gauge, Sparkline, LineChart, AreaChart, StackedBarChart, Heatmap, BarChart, DonutChart, and Legend without a heavy chart dependency.
@froggdesign/tokens owns primitive and semantic design values.
@froggdesign/theme publishes FroggDesign --fd-* CSS variables for light and dark mode.
@froggdesign/enter-ui-react exports React components, .eui-* classes, and component-facing variables.
@froggdesign/enter-ui-solid exports SolidJS primitives with the same visual contract.
@froggdesign/enter-ui-utils owns small helpers such as cn.
EnterUI provides consistent components for everyday product workflows. Neutral surfaces carry hierarchy. Green appears as a small success or selection signal, not as a dominant theme. Components should feel ready for repeated product work, not like decorative demos.