---
version: alpha
name: Fider — identity and feedback-board registration
colors:
  primary: rgb(45, 87, 237)
  text: rgb(78, 71, 75)
  surface: '#FFFFFF'
typography:
  heading:
    fontFamily: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
      "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
    fontSize: 32px
    fontWeight: 800
    lineHeight: 51.2px
  supporting:
    fontFamily: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
      "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
    fontSize: 16px
    fontWeight: 400
    lineHeight: 25.6px
omitted:
- section: spacing
  reason: Measured capture geometry is recorded in Layout; no unobserved global spacing
    scale is inferred.
- section: rounded
  reason: Observed silhouettes are described in Shapes rather than inventing a global
    radius scale.
- section: components
  reason: This reference uses composition guidance in prose, not an inferred component-token
    API.
---

## Overview

A restrained registration screen combining provider choices and name/email inputs with a second numbered block for the feedback-board name and subdomain.

Captured from https://login.fider.io/signup at 2026-10-13T06:04:52.720482+00:00. This reference contains the complete desktop page.

## Colors

Primary/accent: `rgb(45, 87, 237)`. Measured heading/form text: `rgb(78, 71, 75)`. White is an observed light surface. These are reference tokens, not a complete brand palette; artwork and secondary panels introduce additional colors.

## Typography

The principal measured family is `Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"`. Supporting sample uses `Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"`. Preserve the contrast between text roles rather than treating every sample as the body default.

- `h3` “1. Who are you?”: 32px, weight 800, line-height 51.2px, color `rgb(78, 71, 75)`.
- `h3` “2. What is this Feedback Forum for?”: 32px, weight 800, line-height 51.2px, color `rgb(78, 71, 75)`.

Matching mobile text is 32px with 51.2px leading.

## Layout

Use a centered 480px desktop form column with the multicolor mark above the first numbered heading. Put three provider options before an OR divider, then Name and Email. Follow with the board title, subdomain suffix field, legal agreement and blue Confirm action. Provider pages were not opened.

Desktop region: 1440.00 × 1036.00px at a 1440px viewport. Mobile region/page: 390.00 × 1084.00px at a 390px viewport. The primary image is full-page; the standard mobile image covers the opening viewport, with additional audit views only where noted.

At 390px the column expands to 370px inside 10px gutters. Numbered headings wrap and the page scrolls vertically. A separate bottom-viewport check confirmed the board fields, legal agreement and Confirm action are reachable. The nested-scroll flag is body overflow:auto, not missing desktop content.

## Elevation & Depth

Keep the page almost flat: pale background, white fields and fine gray outlines. Blue is reserved for the final confirmation control and linked terms.

## Shapes

Provider options and fields have restrained rounded corners; attach the .fider.io suffix to the domain field as a contiguous gray segment.

## Components

Use a centered 480px desktop form column with the multicolor mark above the first numbered heading. Put three provider options before an OR divider, then Name and Email. Follow with the board title, subdomain suffix field, legal agreement and blue Confirm action. Provider pages were not opened.

Account controls are shown in their logged-out idle state. No credentials, account creation, provider login, trial, form submission or purchase was attempted.

## Do's and Don'ts

- Do retain the measured hierarchy, alignment and responsive changes described above.
- Do keep labels, legal choices and navigation text readable when adapting the design.
- Do replace source-specific copy, prices and customer proof with your own verified content.
- Don't infer hidden validation, focus states, motion timing or accessibility conformance from this screenshot.
- Don't copy decorative detail at the expense of the content structure.