Features

Every feature, from board to export.

What RONA will do in the first release, and what is on our roadmap.

[01]Overview

Everything your brand needs. None of the busywork.

Six things that turn your taste into a system you can ship.

Start from your ideas

Images, swatches, fonts, words, guided options or your Figma file. Mark anything "avoid" to say what you do not want.

A complete system, built for you

8 categories of design tokens, light and dark mode, and automatic contrast checks.

Compare and lock

Compare color schemes, font pairs and spacing options. Keep the values you love.

See every choice live

A live preview on components and sample pages: landing page, dashboard and article.

Know why

Every value shows where it came from: your image, your words, your options or your edit.

Normal or Expressive

One switch adds gradients, glass, grain and playful motion.

[02]All features

Seven groups, one system.

Your board

Start from what you already have: images, colors, fonts and words.

  • One board

    Pan and zoom. Add, move and resize images, swatches, notes, fonts and option chips.

  • Eyedropper

    Pick a color from an image on the board.

  • Style summary

    A short text that describes your style, for example "Warm, muted palette. Soft corners."

  • Describe more

    Ask AI to read an image in more detail. RONA will tell you before it sends the image.

  • Guided options

    No moodboard? Pick style, vibe, theme, emotion, density, corners, mode and brand color.

  • Figma import

    Paste a Figma link. Styles from Figma come in locked.

Your system

8 token categories, built from one style profile.

  • Color

    Palettes from color theory and classic color combinations. 11-step scales. Light and dark mode.

  • Typography

    Curated open-license font pairs. A fluid type scale for mobile and desktop.

  • Spacing

    A scale from your density. Touch targets of 44 px or more on mobile.

  • Shape and motion

    Corners, borders and sizes. Durations and easing. Reduced-motion settings always win.

  • Surface and elevation

    Flat, gradient, glass or textured surfaces. Shadow levels in your palette.

  • Copy voice

    Tone for errors, success and empty states. Words to use and words to avoid.

Compare and lock

Keep control of every value.

  • Candidates

    3 to 5 color schemes, and the top 3 font pairs and spacing options.

  • Combination library

    Browse classic color combinations, sorted by how close they are to your colors.

  • Regenerate a section

    Make one section again. Locked values stay.

  • Locks and reset

    Unlock one value, one section or all. Go back to the generated value at any time.

  • Undo and redo

    For all edits in a session.

  • Normal or Expressive

    One switch adds gradients, glass, grain and playful motion.

Live preview

See each choice on real layouts before you export.

  • Component gallery

    Buttons, inputs, cards, badges, modals, navigation and more.

  • 3 sample pages

    A landing page, a dashboard and an article.

  • Modes and widths

    Light, dark and side by side, at mobile, tablet and desktop width.

  • Accessibility checks

    Contrast, reduced motion and reduced transparency, in the preview.

Export

One zip with the parts you select.

  • Design tokens

    DTCG JSON files for base, light, dark, effects and density modes.

  • Ready code

    Static HTML, CSS and JS. Open it in a browser. No build step.

  • Brand guideline

    A DESIGN.md file for your team, with a part for AI coding tools. It follows the open DESIGN.md format.

  • Docs page and font guide

    One HTML page with live samples, and a guide to each font and its license.

  • Project file

    Download your full project as a file. Needs a free account.

Privacy and access

Your work stays yours.

  • Cloud save

    Sign in with a free account to save your projects and open them on any device. With no account, you keep one draft in your browser.

  • AI only when needed

    Small models read your images in the browser. A language model runs only for some tasks.

  • Free to start

    Edit, preview and export with no account. Generation from your board is a premium feature.

  • Accessible editor

    The editor targets WCAG 2.2 AA, with keyboard control and a screen reader list view.

  • Open-license fonts

    The font picker shows open-license fonts. An unknown license gets a warning.

  • Share for training

    Opt-in only, with a consent screen. You can delete a shared board later.

On our roadmap

Later, not in the first release. We are working toward these.

On our roadmap Vote for the next preview
  • Ecommerce stores

    See your brand on a store home page, product page and cart.

  • Pitch decks

    See your brand on title, content and chart slides.

  • Brand manuals

    A full brand manual with logo rules, print rules and brand applications.

  • Social posts

    See your brand on feed posts, stories and banners.

  • Product mockups

    See your brand on stationery and merchandise.

  • Bumper videos

    See your brand in a short animated intro.

  • Marketing website

    See your brand on a full marketing website, not only a sample landing page.

  • More token formats

    Export tokens for Tailwind, SCSS or Figma variables.

  • Share links

    Share a project with a link.

Coming soon

Your brand system starts with one board.

The waitlist for RONA opens soon.

Waitlist opens soon.