Lucida — User Manual

A computer with a decent monitor

Lucida runs in the browser, so no installation is required, but screen size matters. The larger your monitor, the more useful the side-by-side view becomes. A laptop works, though a 13-inch screen is on the small side. If you have an external display available, use it.

A camera

You need at least one camera to capture your artwork as you work. A built-in laptop webcam will do in a pinch, but the image quality is usually poor and the fixed position limits your options. An external USB webcam is a significant improvement. Your phone is often the best camera you own. It can connect to your computer wirelessly or via USB and typically produces a sharper, better-exposed image than most webcams. If you plan to also capture a live model or a physical reference object, you may want a second camera for that.

A stable mount

The camera pointing at your canvas needs to stay still. Shaking is fine; sliding or drifting is not. A tripod with an adjustable arm, a flexible mount clamped to your easel, or even a stack of books will work as long as the camera does not move between sessions. The perspective correction you set up in the app is tied to a specific camera position, so if the camera shifts, you will need to redo it.

Good lighting

Uneven or shifting light — a window that changes through the day, a lamp casting a strong shadow across one side — will make it hard to do accurate value and color comparisons. Consistent, even light across your drawing surface gives you a more reliable image to work with.

The dimensions of your drawing surface

This one surprises people. The app uses the physical width and height of your canvas or paper to calculate perspective correction accurately. You do not need to measure to the millimeter; approximate dimensions in any unit will do, as long as width and height are in the same unit. Knowing this before you start means you will not have to stop and measure once you are set up.

The main view

The main view occupies the center of the screen and is divided into two equal panes. Each pane renders an image or a live camera feed and accepts its own set of adjustments: filters, transforms, and other tools applied independently. The panes are sometimes labelled "reference" and "artwork," but those are just convenient shorthand for the most common arrangement. There is no requirement for which goes where — you can load any media into either pane and configure each however you like.

The toolbar

Each pane has its own toolbar running along the top, giving you access to controls for that specific source: loading media, adjusting image settings, applying corrections, and so on.

Side-by-side mode

Side-by-side mode places your two sources next to each other, separated by a divider you can drag to resize the panes. By default both panes are equal width. This is the digital equivalent of the sight-size method used in classical ateliers, where you position your canvas and your subject so they appear at the same scale from a fixed viewing point. With both images at matching sizes, you can scan directly between them to check proportions, shapes, and values without any mental conversion. This is the mode most artists spend most of their time in.

Overlay mode

Overlay mode places one source on top of the other, with adjustable opacity and blending. This is where tracing happens. You align your reference over your canvas, adjust the blend so both are visible simultaneously, and draw directly on your surface using the projected image as a guide. How much you rely on the overlay is entirely your choice — some artists use it to establish proportions and then work freely, others check alignment throughout.

The status bar

The status bar appears at the bottom of the screen when the color picker is active. It displays the sampled color values from the point you are hovering over, letting you compare your reference colors against what you have mixed on your palette without switching tools or interrupting your flow.

Pop-up windows

Pop-up windows appear for tools that require more space or focused interaction, such as perspective correction or detailed image adjustments. They float over the main view, can be dragged to any position, and can be dismissed when you are done.

Context menus

Context menus provide quick access to additional options for a specific pane or element. They appear on right-click or via a dedicated button, depending on the context, and keep the toolbar uncluttered by surfacing less frequently used actions only when relevant.

Higher limits in Pro

Features exclusive to Pro

Activating a license

Select Enter License Code from the ☰ Help menu in the toolbar, or go directly to the activation page. The upgrade takes effect immediately and no page reload is required. However, if you are not seeing pro features, you may have to hard-refresh the page using Ctrl+Shift+R (Windows) or Cmd+Shift+R (Mac). Your license status is shown in the About dialog at any time.

Side-by-side

Both panes are displayed side by side, separated by a divider you can drag to resize them. By default both panes are equal, but you can shift the divider to give more screen space to whichever side needs it at a given moment.

This is the digital equivalent of the sight-size method used in classical ateliers, where you position your canvas and your subject so they appear at the same scale from a fixed viewing point. With both images at matching sizes, you can scan directly between them to check proportions, shapes, and values without any mental conversion. This is the mode most artists spend most of their time in.

Overlay

One pane is placed on top of the other. You align your reference over your canvas, and both are visible simultaneously — allowing you to draw directly on your surface using the projected image as a guide. How much you rely on the overlay is entirely your choice: some artists use it only to establish initial proportions and then work freely; others return to it throughout.

Overlay mode offers three blending modes, selectable from the Overlay Options dialog:

Strobe Pro

Strobe pulses the top layer's opacity on and off in a smooth cycle, using a cosine wave. At each peak the layer is fully visible at its set opacity; at each trough it fades to invisible. The effect is similar to rapidly alternating your attention between the two images — differences in proportion and shape tend to jump out more clearly when the reference flickers on and off against your drawing rather than sitting static. Speed is adjustable from 0.1 Hz (feels like once every five seconds) to 2 Hz (feels like four times per second). Strobe is available in overlay mode only and requires a Pro license.

Checking proportions and alignment

Drag the crosshair to a landmark on your reference — the corner of an eye, the edge of a shadow, a specific contour point — and the same lines appear on your artwork at the same position. You can see immediately whether that feature is where it should be, without guessing or measuring by eye alone.

Comparing sizes and intersections

Because the lines run across the full width and height of each pane, they also let you read intersections: what else falls on this horizontal? What lies directly above or below this point? These are the questions a trained eye asks constantly when assessing a drawing, and the crosshair makes them easy to answer with a glance.

Reading angles

The horizontal line also serves as a fixed reference for judging angles. Place the crosshair where two forms meet or where a line begins, and you can directly compare the angle of a contour in your reference against the angle in your drawing — both measured against the same baseline.

What gets synced

Sync covers all four transforms:

Zoom centering

When you zoom with sync on, both images zoom around the same focal point — the cursor position when using a scroll wheel or pinch gesture, or the center of the pane when using the toolbar zoom buttons. This prevents the images from slowly drifting apart as you zoom in and out.

Enabling sync

The sync button sits between the two pane toolbars in the center of the screen. It requires content to be loaded in both panes before it becomes active. When sync is on, the button turns dark orange. It is also accessible from the right-click context menu under View.

Sample modes

You can sample a single pixel for precise spot readings, or switch to area averaging — which samples a small region around your cursor and averages the result. Area averaging is useful when the image is noisy or grainy, where a single-pixel reading can jump around and give a misleading value. For most photographic reference, averaging gives a more stable and representative result.

Color comparison

The status bar shows you not just the raw values, but the relationship between the two sampled colors. For each pair of points you are comparing, you get:

• How much lighter or darker one color is than the other
• How much warmer or cooler it is
• How much more or less saturated it is

This maps directly to the adjustments a painter makes at the palette. Instead of reading HSL numbers and doing mental arithmetic, you get an immediate answer to the practical question: should I add more white, shift toward yellow, or gray this down?

Synchronized picking

When Image Synchronization is active at the same time as the color picker, tapping to pick a color in one pane automatically picks the geometrically equivalent position in the other pane. The app maps your tap through each pane's zoom, pan, rotation, and flip transforms and places the marker in both panes simultaneously. You can compare matching points on your reference and your painting with a single tap rather than clicking in both panes separately. The color marker circle also rescales in real time during pinch-zoom gestures so it visually tracks the correct spot throughout the gesture.

Paint recipes

For a sampled color, the app can generate an approximate mixing recipe expressed in the traditional painter's primaries: Red, Yellow, Blue, White, and Black (RYBWK). The recipe shows the rough proportion of each pigment needed to arrive at that hue. These are estimates, not precise formulas — paint pigments vary and the model cannot account for every paint brand or medium. Treat the recipe as a useful starting point, not an exact prescription.

Local grid

A local grid is attached to the image in its pane. It follows the image as you zoom, pan, and rotate, staying locked to the content beneath it. This makes it useful for the grid transfer method: divide your reference into equal sections, draw the same grid on your canvas, and copy each cell in turn. Because the grid moves with the image, it stays correctly proportioned regardless of how you adjust the view.

Global grid

A global grid is fixed to the screen and renders on top of everything, independent of any image. It does not move when you zoom or pan. This makes it useful for checking composition and placing key landmarks — you are measuring against the full pane, not against the image's own coordinate system.

Grid color and opacity

Grid color and opacity are fully adjustable. You can set any custom color and dial the opacity up or down to suit the complexity and tone of the image underneath.

When you do not want to pick a color manually, Auto color mode handles it for you. The grid automatically chooses a high-contrast color based on the content beneath it — switching to a lighter or darker tone as needed to remain visible against any background without washing out the image. Note that auto color works by inverting the luminance of the area below; on mid-grey backgrounds, the inverted result is also grey, so the grid may remain hard to see. If that happens, set a custom color manually instead.

Brightness

Adjusts overall lightness. The default is 100 — values above brighten the image, values below darken it. This is useful when your reference was shot in different lighting conditions than your working environment, or when a camera feed is over- or under-exposed. Pro users can push further in both directions (0–200) than Basic (50–150).

Contrast

Adjusts the difference between lights and darks. The default is 100. Raising contrast makes shadows darker and highlights brighter; lowering it compresses the tonal range into a flatter, more uniform appearance. Useful for making value structure easier to read. Pro users get the same expanded range as brightness (0–200 vs 50–150 for Basic).

Saturation

Adjusts color intensity. The default is 100. Setting it to 0 converts the image to full grayscale — a common technique for value study, where removing color makes it easier to judge relative lightness without the distraction of hue. The range is 0–200 on both Basic and Pro.

Blur

Applies a Gaussian blur to the image. The default is 0 (no blur). A small amount of blur can be useful for value work: softening a photographic reference reduces distracting detail and makes broad value masses easier to read, which is closer to how you should be thinking about tone when blocking in. The range is 0–10px on Basic, 0–15px on Pro.

Zoom

Scroll the mouse wheel or use a two-finger pinch gesture to zoom. The toolbar zoom menu offers zoom-in and zoom-out buttons, a zoom-to-fit button, and a field for entering a precise percentage. Zooming with the wheel or pinch is cursor-aware — the image scales around the point under your cursor, so the area you are focused on stays in place. Toolbar buttons zoom around the center of the pane instead.

The minimum and maximum zoom are calculated dynamically based on the image's dimensions and the size of the pane. Pro users can zoom in further than Basic, because Pro renders at a higher internal canvas resolution.

Pan

Drag the image to move it within the pane. For precise positioning, the Transform menu has numeric X and Y pan fields where you can enter exact pixel offsets (from −1000 to 1000).

The Align menu provides three shortcuts to reset the pan position. Center resets both axes at once. Center X resets only the horizontal offset, leaving the vertical position unchanged. Center Y resets only the vertical offset. Each button is disabled when the corresponding axis is already at zero.

Rotation

Rotate the image from −180° to +180°. The Transform menu has a rotation field for direct numeric input. Rotation is applied around the center of the image. If the image is flipped, the visual direction of rotation is corrected automatically so it still behaves intuitively — rotating clockwise always appears clockwise regardless of flip state.

Flip

Flip the image horizontally (left–right mirror) or vertically (upside down). Both can be active at once. Flipping is useful for checking compositional balance or comparing a mirrored view of your reference — a common technique for catching errors that become invisible when you have been looking at the same image for a long time.

Exporting an Image

The Export option in the context menu saves the current pane to a PNG file. The exported image reflects exactly what you see: filters (brightness, contrast, saturation, blur), rotation, flip, and posterization are all baked into the output. Perspective correction is included when active.

The filename is derived from the original loaded file. If no filename is available, the file is named artwork-export.png or reference-export.pngdepending on which pane you export from.

Bring to Front

In overlay mode, one pane sits on top of the other. Bring to Front moves the pane you are working in to the top of the stack. The top layer is the active layer: all mouse and touch gestures — zoom, pan, drag — are directed to it, and its opacity and blending settings control what shows through. Use this when you want to interact with a specific pane without switching out of overlay mode. The button appears in the toolbar and context menu only when overlay mode is active, and is disabled if the pane is already on top.

The browser is asking for camera permission — or blocked it

Lucida needs camera access to show a live feed. The first time you open a camera source, the browser will show a permission prompt. Click Allow. If you previously denied it, the prompt will not appear again automatically — you will need to reset the permission in the browser's site settings (usually accessible by clicking the lock icon in the address bar) and reload the page.

My camera does not appear in the list

If the camera list is empty or missing a device you expect:

• Make sure the camera is connected and recognized by the operating system before opening Lucida.
• Check that no other application (video call software, another browser tab) is holding exclusive access to the camera.
• Try reloading the page after connecting the camera.
• Some browsers require camera permission to be granted once before the full device list is revealed. Open any camera source, approve the permission, then check the list again.

The live feed looks blurry or low quality

Built-in laptop webcams typically have limited resolution and poor low-light performance. An external USB webcam or a phone used as a camera will give noticeably better results. Good, even lighting also has a large impact — a well-lit subject under a consistent light source will look sharper and have more accurate colors than one lit by a window that changes through the day.

The correction looks right but then drifts or goes wrong

Perspective correction is calculated from the camera's position relative to the canvas. If the camera moves — even slightly — the four corners you marked no longer correspond to the actual corners of the surface. Re-enter editing mode, drag the handles back into position, and re-apply. This is why a stable, fixed mount is important for anyone doing extended sessions.

I see a "Perspective angles too extreme" warning

This appears when the four corner handles form a shape that cannot be resolved into a valid perspective transform — for example when two handles are very close together, or the quadrilateral is self-intersecting (handles have crossed). Move the handles so they form a proper convex quadrilateral matching the outline of your drawing surface.

The corrected image looks stretched

Check the width and height fields in the Selection toolbar. The dimensions you enter set the aspect ratio of the corrected output. If you entered a width that is much larger or smaller than the height relative to the actual canvas, the image will appear stretched in one direction. Re-enter the real dimensions of your drawing surface (any unit, but both fields must use the same unit).

Also check the rotation and flip settings on the pane. If the image is rotated 90° or flipped, what appears as "width" on screen may correspond to the physical height of your canvas and vice versa. In that case, swap the two values — enter the physical height in the Width field and the physical width in the Height field — to match the orientation as it is currently displayed.

I can only see one image in overlay mode

In overlay mode the opacity of the top layer controls how much of the bottom shows through. If the opacity is at 100%, the top layer completely covers the bottom one. Lower the opacity slider until both are visible. Also check the blend mode — Drawing and Negative Drawing modes make parts of the top layer transparent based on luminance, which can make the image appear to disappear on certain background colors.

Drawing blend mode is not hiding my paper

Drawing mode makes light areas of the top layer transparent, which works well for white or light-colored paper. If your drawing surface is toned or dark, use Negative Drawing mode instead — it makes dark areas transparent, leaving lighter marks visible against the reference beneath.

The images are not aligned in overlay mode

Without Image Synchronization enabled, each pane's zoom and pan are independent. Enable Sync (the button between the two toolbars) and then align one image — the other will follow. If the images have different proportions, perspective correction on the artwork pane will help match the two shapes before overlaying.

Posterization is slow or causes stuttering

Posterization processes every pixel in real time. A few things that can help:

• Reduce the Smoothness value — the pre-blur pass is the most expensive part of the calculation.
• Use a smaller source image. Very high-resolution photos take longer to process. The effect is usually just as readable at a lower resolution.
• Make sure hardware acceleration is enabled in your browser settings. Lucida uses WebGL for posterization when available; without it the processing falls back to the CPU, which is significantly slower.

The app feels sluggish in general

Lucida renders at up to 120fps (Pro) or 60fps (Basic) with a live camera. On older or lower-powered hardware, this can strain the GPU. Try closing other browser tabs, disabling any browser extensions that inject content into pages, and ensuring your browser is using the dedicated GPU rather than integrated graphics (relevant on laptops with dual graphics).

If you are using Safari, switch to Chrome or Firefox. Safari imposes its own frame rate limits on canvas rendering that can cut the effective fps well below what Lucida requests — you may see noticeably choppier live camera playback and slower filter response compared to other browsers on the same machine. Chrome is the recommended browser for the best performance.

My HEIC file will not load

HEIC is the default photo format on iPhones. On browsers with native HEIC support (Safari on macOS and iOS), Lucida loads the file directly. On all other browsers it converts to JPEG automatically before loading. If a HEIC file fails to load, the file is likely corrupted or a variant that neither the browser nor the converter recognizes. Try opening it in Photos or Preview, exporting as JPEG, and loading that instead.

The grid lines are hard to see

The Auto grid color mode works by inverting the luminance of the image beneath the grid lines. On mid-grey content the inverted color is also mid-grey, making the lines nearly invisible. Switch to a manual grid color and choose something with high contrast against your image — a bright accent color or pure white or black usually works.

The Sync button is greyed out

Image Synchronization requires both panes to have content loaded. If either pane is empty, the Sync button is disabled. Load an image or connect a camera to both panes, and the button will become available.

"Your previous image couldn't be restored automatically"

This message appears when a saved session references an image that was loaded from a local file on your device. Browsers do not allow a web page to silently re-read local files between sessions — doing so without the user's explicit action would be a security risk. Lucida can save and restore everything else about your workspace (settings, zoom, pan, adjustments), but it cannot automatically reload a file from your disk. To continue, simply re-open the file using the load button in the toolbar.

Images loaded from a URL or from the Media Library are not affected — those sources can be restored automatically because no local file access is required.

Something is not working as expected

Select Report an Issue from the ☰ Help menu in the toolbar. Include your browser version, operating system, and a description of what you expected versus what happened.