'/%3e%3cg%20transform='translate(170%20205)%20scale(0.3606)'%20fill='%23111011'%3e%3cpath%20d='M497%20640H359L248%20320%20122%20640H0L256%200z'/%3e%3cpath%20d='M292.43%20640H200.8L248%20522z'/%3e%3cpath%20d='M335%200h138l111%20320L710%200h122L576%20640z'/%3e%3c/g%3e%3c/svg%3e){kind=small}
Resources
Start from something finished
Full page templates, ready blocks, a playground, the Figma kit and plugins. Take a screen that already works and make it yours.
- 403
- 404
- 500
- Landing page
- Dashboard
- Settings
- Sign in
- Bento landing (Graphite)
- Analysis dashboard
- Monitor dashboard
- Workplace
- Table list
- Card list
- Search list
- Board
- Basic form
- Step form
- Advanced form
- Basic profile
- Advanced profile
- Success
- Fail
- Account center
- Account settings
In this section
Build faster
- TemplatesFull pages to start from: a Pro app with dashboards, lists, forms, profiles, results and exceptions, plus landing, settings and sign-in.
- BlocksReady-made sections built from the components: hero, features, pricing, FAQ, auth, settings, data tables, onboarding and more.
- PlaygroundEvery component in every state, dark and light side by side.
- Figma kitThe same tokens as Figma variables in Dark and Light, and components with the same props.
And more
Plugins, Pro and the license
- Figma pluginsContrast, type scales, token drift, text stress tests and more, made for the way Alea is built.
- Alea ProThe paid part of Alea: charts, DataGrid, drag and drop, the Markdown editor, CalendarView, premium effects, blocks, templates and the Figma kit, under a commercial license.
- LicenseHow Alea is licensed: the core under MIT, Alea Pro under a commercial license, and the open source projects it builds on.
Recently added
New in Alea
- PromptInputThe message box of an assistant: it grows with the text, Enter sends, the Send button turns into Stop while a response is generated, and suggestions give people a place to start.
- AI response partsWhat goes around an answer: the reasoning behind it, the tools an agent ran, the sources it used with inline citations, and actions to copy, regenerate and rate it.
- RichTextEditorA rich text (WYSIWYG) editor with a toolbar that collapses to the most used tools: text styles and sizes, marks, lists and checklists, tables you can edit, images, find and replace, and Markdown shortcuts. Pasted content and the value are cleaned to a safe set of tags.
- SchedulerDay and week views with a time grid: events placed by time and side by side when they overlap, an all-day row, the current time, a period switcher, a view switch and new events from a click or a button.
- MediaPlayerVideo and audio with controls in the Alea look: play, seek with a time readout, skip back and forward, volume, speed, captions, picture in picture and full screen, with the keys people already know.
- ModalA modal that holds anything: a form, a gallery, a video, a wizard. Optional header and footer, seven sizes, centered or at the top, the body or the whole modal scrolling, edge-to-edge media and three backdrops.
- ChatConversations: messages in bubbles or plain, runs from the same author, day separators, a New messages line, delivery states, reactions, thread links, hover actions and a typing indicator.
- AppLauncherThe grid of apps behind a button in the header, to jump between the products of a suite.
Templates
Every template
Each one is a real page made from the components, ready to open, copy and change.
- 403No access.
- 404Not found.
- 500Server error.
- Landing pageHero, features, testimonials, pricing, FAQ, call to action and footer.
- DashboardKPIs, onboarding, notifications, orders and a calendar in the app shell.
- SettingsAccount settings in the app shell.
- Sign inA split page: the brand on one side, the form on the other.
- Bento landing (Graphite)The monochrome Graphite preset: a sans hero, a bento grid of live components, a logo marquee and a beamed pricing card.
- Analysis dashboardKPI cards with tiny charts, a sales trend with a ranking, top searches and sales by category.
- Monitor dashboardLive numbers, a request chart, capacity gauges, an error heatmap and incidents.
- WorkplaceA greeting, projects, activity, quick links and the team index.
- Table listA query form above a full data grid.
- Card listProducts as cards with ribbons and actions.
- Search listSearch with suggestions, filters and paged results.
- BoardA kanban board you can use with the keyboard.
- Basic formOne card of common fields.
- Step formFill, confirm, done.
- Advanced formSections, a members table and a sticky action bar.
- Basic profileOrder details, items and shipping.
- Advanced profileHeader stats, progress, details and a log.
- SuccessA success result with next steps.
- FailA failure result with the reasons.
- Account centerProfile, tags, teams and work.
- Account settingsSections for profile, security, accounts and notifications.
Questions