{
  "$schema": "https://mian.ro/schema/v2/registry.json",
  "schemaVersion": "2.0.0",
  "generatedAt": "2026-10-02T13:14:06.957Z",
  "id": "acini",
  "name": "Acini di pepe",
  "family": "Pixel",
  "origin": "Italy · “peppercorns”",
  "tagline": "Peppercorn dots and halftone.",
  "description": "Acini di pepe, “peppercorns”, are tiny beads of pasta, a pinch of dots in every spoonful of soup. Acini di pepe is a halftone system: dotted edges instead of lines, surfaces shaded with dot screens, progress that grows from small dots to large, and charts printed in dots.",
  "inspiration": [
    "A spoonful of tiny beads → dotted borders and dotted underlines instead of solid lines",
    "Printed like a newspaper photo → halftone dot screens shade surfaces, selections and charts",
    "Growing beads → progress and emphasis grow the dots, from specks to full circles",
    "Pepper and broth → pepper black on warm paper, one teal accent"
  ],
  "traits": {
    "mood": [
      "halftone",
      "dotted",
      "print",
      "playful",
      "editorial"
    ],
    "intensity": 3,
    "contrast": "medium",
    "geometry": "dotted edges, round beads",
    "type": "grotesk",
    "surface": "halftone dot screens",
    "motion": "dotted fills",
    "goodFor": [
      "magazines",
      "music",
      "culture",
      "creative studios"
    ],
    "lessFor": [
      "dense admin"
    ],
    "density": "default"
  },
  "license": "LicenseRef-MIAN-1.0",
  "designLanguage": {
    "essence": "Acini di pepe is halftone. Peppercorn-sized beads of pasta become a system printed in dots: dotted edges instead of lines, surfaces shaded with dot screens, selection and emphasis shown by bigger dots, progress that grows from specks to full circles, and charts printed in halftone. Pepper black on warm paper, one teal accent.",
    "principles": [
      "Dotted, not solid: borders are 2px dotted; focus turns them solid.",
      "Shade with a screen: var(--ac-screen) (1px dots) for tint, var(--ac-screen-2) (1.6px) for emphasis.",
      "Bigger dots mean more: progress, the selected tab underline and highlights grow the dot size.",
      "One teal accent; everything else is pepper and paper."
    ],
    "aspects": {
      "Shape": "8px controls, 12px containers, pill badges; round dot knobs.",
      "Surface": "Warm paper with a dotted edge; halftone-shaded headers, footers and hovers.",
      "Colour": "Pepper black, warm paper, teal (#0f766e).",
      "Type": "Clean sans at 600–650.",
      "Motion": "acini-in: a soft 2px blur and scale; the spinner is three bouncing peppercorns.",
      "Data": "Halftone columns with a solid teal highlight; progress as a row of dots growing to 8px."
    },
    "extend": [
      "border: 2px dotted var(--mn-input); background: var(--mn-surface).",
      "Tint or hover: background: var(--ac-screen-2), var(--mn-surface-2).",
      "Rows of dots: radial-gradient(circle, <colour> 2px, transparent 2.4px) 0 50% / 8px 6px repeat-x."
    ],
    "avoid": [
      "Solid 1px rules",
      "Flat grey tints (use a dot screen)",
      "Shadows"
    ],
    "recipe": "[data-noodle=\"acini\"] .tile { padding: 12px 16px; border: 2px dotted var(--mn-input); border-radius: 12px; background: var(--mn-surface); }\n[data-noodle=\"acini\"] .tile:hover { background: var(--ac-screen), var(--mn-surface); }\n[data-noodle=\"acini\"] .tile[aria-selected=\"true\"] { border-style: solid; border-color: var(--mn-fg); background: var(--ac-screen-2), var(--mn-surface-2); }"
  },
  "psychology": {
    "temperature": "warm",
    "colours": [
      {
        "role": "Primary",
        "hex": "#1b1a17",
        "family": "Black and ink",
        "depth": "deep, muted",
        "says": "Authority, precision, luxury. It makes everything next to it look more deliberate.",
        "use": "Fashion, editorial, developer tools, any brand that will let its content be the colour.",
        "risk": "Pure #000 on pure #fff is harsh on long text. Soften one of the two slightly, or warm both."
      },
      {
        "role": "Accent",
        "hex": "#0f766e",
        "family": "Teal and cyan",
        "depth": "deep, saturated",
        "says": "Clarity, cleanliness, calm technology. Cooler than green, softer than blue.",
        "use": "Health tech, wellness, productivity tools, water and travel.",
        "risk": "Very common in medical and SaaS products, so it needs a distinctive neutral or typeface to be remembered."
      },
      {
        "role": "Page",
        "hex": "#fbf9f4",
        "family": "White and paper",
        "depth": "pale",
        "says": "Space, honesty, simplicity. Warm whites feel human, cool whites feel clinical.",
        "use": "Almost everything. The page colour sets the temperature of the whole brand.",
        "risk": "Empty is not the same as calm: white space needs a grid behind it."
      }
    ],
    "relation": "A neutral primary with one teal and cyan accent: the accent means “look here” precisely because nothing else is coloured.",
    "type": {
      "body": {
        "class": "neutral",
        "name": "Neutral sans",
        "says": "Clear, modern, impartial. The voice of software and signage.",
        "use": "Interfaces, documentation, most product marketing.",
        "risk": "The same few neutral sans typefaces set every generated page. Without a distinct weight, size or pairing it reads as a template."
      },
      "heading": {
        "class": "neutral",
        "name": "Neutral sans",
        "says": "Clear, modern, impartial. The voice of software and signage.",
        "use": "Interfaces, documentation, most product marketing.",
        "risk": "The same few neutral sans typefaces set every generated page. Without a distinct weight, size or pairing it reads as a template."
      },
      "weight": 650,
      "summary": "One voice throughout: neutral sans. Headings are semibold, which reads as confident without shouting."
    },
    "personality": {
      "reads": [
        "halftone",
        "dotted",
        "print",
        "playful",
        "editorial"
      ],
      "intensity": 3,
      "dimensions": [],
      "suits": [
        "magazines",
        "music",
        "culture",
        "creative studios"
      ],
      "lessFor": [
        "dense admin"
      ],
      "tone": "Lively. A point of view in the headline, concrete verbs, a little humour where it is true."
    },
    "logo": "A simple geometric mark with slightly softened corners fits; avoid both hard spikes and full circles."
  },
  "url": "https://mian.ro/noodles/acini",
  "markdownUrl": "https://mian.ro/ai/noodles/acini.md",
  "stylesheet": "https://mian.ro/dist/noodles/acini.css",
  "usage": "<html data-noodle=\"acini\">",
  "fonts": {
    "sans": "ui-sans-serif, system-ui, -apple-system, \"Segoe UI Variable Text\", \"Segoe UI\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
    "heading": "ui-sans-serif, system-ui, -apple-system, \"Segoe UI Variable Text\", \"Segoe UI\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
    "mono": "ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace"
  },
  "headingWeight": 650,
  "radius": {
    "field": "8px",
    "box": "12px",
    "badge": "999px"
  },
  "shadow": "none",
  "density": "default",
  "glass": false,
  "light": {
    "bg": "#fbf9f4",
    "surface": "#fffefb",
    "surface2": "#f1ede3",
    "fg": "#1b1a17",
    "muted": "#5f5b52",
    "border": "#e3ddcf",
    "input": "#b9b1a0",
    "primary": "#1b1a17",
    "primaryFg": "#ffffff",
    "secondary": "#f1ede3",
    "secondaryFg": "#1b1a17",
    "accent": "#0f766e",
    "accentFg": "#ffffff",
    "ring": "#0f766e",
    "success": "#15803d",
    "successFg": "#ffffff",
    "warning": "#b45309",
    "warningFg": "#ffffff",
    "danger": "#dc2626",
    "dangerFg": "#ffffff",
    "info": "#0369a1",
    "infoFg": "#ffffff",
    "primaryText": "#1b1a17",
    "secondaryText": "#75736d",
    "accentText": "#0f746c",
    "successText": "#15783a",
    "warningText": "#a84e0a",
    "dangerText": "#c52524",
    "infoText": "#0369a1",
    "link": "#1b1a17"
  },
  "dark": {
    "bg": "#11100e",
    "surface": "#191815",
    "surface2": "#22201c",
    "fg": "#f2eee5",
    "muted": "#a9a397",
    "border": "#2d2a25",
    "input": "#5b564c",
    "primary": "#f2eee5",
    "primaryFg": "#1b1a17",
    "secondary": "#22201c",
    "secondaryFg": "#f2eee5",
    "accent": "#5eead4",
    "accentFg": "#04201c",
    "ring": "#5eead4",
    "success": "#4ade80",
    "successFg": "#052e16",
    "warning": "#fbbf24",
    "warningFg": "#1f1300",
    "danger": "#f87171",
    "dangerFg": "#210505",
    "info": "#38bdf8",
    "infoFg": "#03202d",
    "primaryText": "#f2eee5",
    "secondaryText": "#86837c",
    "accentText": "#5eead4",
    "successText": "#4ade80",
    "warningText": "#fbbf24",
    "dangerText": "#f87171",
    "infoText": "#38bdf8",
    "link": "#f2eee5"
  },
  "css": "[data-noodle=\"acini\"] {\n  --mn-bg: light-dark(#fbf9f4, #11100e);\n  --mn-surface: light-dark(#fffefb, #191815);\n  --mn-surface-2: light-dark(#f1ede3, #22201c);\n  --mn-fg: light-dark(#1b1a17, #f2eee5);\n  --mn-muted: light-dark(#5f5b52, #a9a397);\n  --mn-border: light-dark(#e3ddcf, #2d2a25);\n  --mn-input: light-dark(#b9b1a0, #5b564c);\n  --mn-primary: light-dark(#1b1a17, #f2eee5);\n  --mn-primary-fg: light-dark(#ffffff, #1b1a17);\n  --mn-secondary: light-dark(#f1ede3, #22201c);\n  --mn-secondary-fg: light-dark(#1b1a17, #f2eee5);\n  --mn-accent: light-dark(#0f766e, #5eead4);\n  --mn-accent-fg: light-dark(#ffffff, #04201c);\n  --mn-ring: light-dark(#0f766e, #5eead4);\n  --mn-success: light-dark(#15803d, #4ade80);\n  --mn-success-fg: light-dark(#ffffff, #052e16);\n  --mn-warning: light-dark(#b45309, #fbbf24);\n  --mn-warning-fg: light-dark(#ffffff, #1f1300);\n  --mn-danger: light-dark(#dc2626, #f87171);\n  --mn-danger-fg: light-dark(#ffffff, #210505);\n  --mn-info: light-dark(#0369a1, #38bdf8);\n  --mn-info-fg: light-dark(#ffffff, #03202d);\n  --mn-primary-text: light-dark(#1b1a17, #f2eee5);\n  --mn-secondary-text: light-dark(#75736d, #86837c);\n  --mn-accent-text: light-dark(#0f746c, #5eead4);\n  --mn-success-text: light-dark(#15783a, #4ade80);\n  --mn-warning-text: light-dark(#a84e0a, #fbbf24);\n  --mn-danger-text: light-dark(#c52524, #f87171);\n  --mn-info-text: light-dark(#0369a1, #38bdf8);\n  --mn-link: light-dark(#1b1a17, #f2eee5);\n  --mn-font: ui-sans-serif, system-ui, -apple-system, \"Segoe UI Variable Text\", \"Segoe UI\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  --mn-font-heading: ui-sans-serif, system-ui, -apple-system, \"Segoe UI Variable Text\", \"Segoe UI\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n  --mn-font-mono: ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace;\n  --mn-heading-weight: 650;\n  --mn-radius-field: 8px;\n  --mn-radius-box: 12px;\n  --mn-radius-badge: 999px;\n  --mn-shadow-sm: none;\n  --mn-shadow-md: none;\n  --mn-shadow-lg: none;\n  --mn-size-xs: 26px;\n  --mn-size-sm: 32px;\n  --mn-size-md: 38px;\n  --mn-size-lg: 46px;\n  --mn-text-sm: 14px;\n  --mn-surface-alpha: 100%;\n  --mn-backdrop: none;\n  --mn-bg-image: none;\n}\n"
}