Academia (Scholarly Mobile)

ui-ux-pro-maxMITMobile app · mobile-appDark · darkMedium · mediumOrange · orangeMedium · mediumSerif · serifGeneral · generalProfessional · professional

Academia (Scholarly Mobile). Best for Knowledge management apps, deep reading tools, ritual-heavy personal brands, lore-heavy RPG/roleplay apps, culture-specific community platforms.

NNorthwind

Product · Pricing

Specimen

Make the work feel finished

One interface, dressed in this style. Compare type, color, radius, and density.

128

Active

4.8

Score

12ms

Edge

Attribution

"Academia (Scholarly Mobile)" from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill (MIT). © Next Level Builder. src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile @ 28b3b8dee8c9.

https://github.com/nextlevelbuilder/ui-ux-pro-max-skill · src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile · 28b3b8dee8c9 · © Next Level Builder

Do

Mahogany/oak/parchment palette applied
☐ Brass used on all tappable items
☐ Arch-top imagery used in hero/cards
☐ Drop caps & Roman numerals used
☐ Vignette overlay present
☐ No sans-serif body fonts

Don't

Hyper-modern tech dashboards
neon/glassmorphism
playful Gen Z branding

Prompt

Design a Academia (Scholarly Mobile) mobile interface using academia, library, mahogany, parchment, brass, crimson, serif, drop cap. Prioritize clear hierarchy, safe areas, touch targets, visible focus, and reduced-motion alternatives.

---
"Academia (Scholarly Mobile)" from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill (MIT). © Next Level Builder. src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile @ 28b3b8dee8c9.
powered by Styledex — https://styledex.dev

Tokens

DTCG

{
  "$schema": "https://www.designtokens.org/schemas/2025.10/format.json",
  "$description": "Academia (Scholarly Mobile). \"Academia (Scholarly Mobile)\" from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill (MIT). © Next Level Builder. src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile @ 28b3b8dee8c9.",
  "$extensions": {
    "dev.styledex": {
      "id": "uupm-academia-scholarly-mobile",
      "license": "MIT",
      "attribution": "\"Academia (Scholarly Mobile)\" from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill (MIT). © Next Level Builder. src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile @ 28b3b8dee8c9.",
      "banner": "powered by Styledex — https://styledex.dev"
    }
  },
  "color": {
    "background": {
      "$type": "color",
      "$value": "#1c1714"
    },
    "foreground": {
      "$type": "color",
      "$value": "#fafaf9"
    },
    "card": {
      "$type": "color",
      "$value": "#1c1714"
    },
    "card-foreground": {
      "$type": "color",
      "$value": "#fafaf9"
    },
    "primary": {
      "$type": "color",
      "$value": "#251e19"
    },
    "primary-foreground": {
      "$type": "color",
      "$value": "#fafaf9"
    },
    "secondary": {
      "$type": "color",
      "$value": "#e8dfd4"
    },
    "secondary-foreground": {
      "$type": "color",
      "$value": "#fafaf9"
    },
    "accent": {
      "$type": "color",
      "$value": "#e8dfd4"
    },
    "accent-foreground": {
      "$type": "color",
      "$value": "#1c1917"
    },
    "muted": {
      "$type": "color",
      "$value": "#2a2522"
    },
    "muted-foreground": {
      "$type": "color",
      "$value": "#a3a3a2"
    },
    "border": {
      "$type": "color",
      "$value": "#3c3735"
    },
    "destructive": {
      "$type": "color",
      "$value": "#dc2626"
    },
    "ring": {
      "$type": "color",
      "$value": "#251e19"
    }
  },
  "font": {
    "sans": {
      "$type": "fontFamily",
      "$value": [
        "ui-sans-serif",
        "system-ui",
        "sans-serif"
      ]
    },
    "serif": {
      "$type": "fontFamily",
      "$value": [
        "ui-serif",
        "Georgia",
        "serif"
      ]
    },
    "mono": {
      "$type": "fontFamily",
      "$value": [
        "ui-monospace",
        "SFMono-Regular",
        "Menlo",
        "monospace"
      ]
    }
  },
  "radius": {
    "base": {
      "$type": "dimension",
      "$value": "0.5rem"
    }
  },
  "spacing": {
    "base": {
      "$type": "dimension",
      "$value": "1rem"
    }
  },
  "shadow": {
    "base": {
      "$type": "shadow",
      "$value": "0 1px 2px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.04)"
    }
  }
}

CSS

/* powered by Styledex — https://styledex.dev */
/* "Academia (Scholarly Mobile)" from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill (MIT). © Next Level Builder. src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile @ 28b3b8dee8c9. */
:root {
  --background: #1c1714;
  --foreground: #fafaf9;
  --card: #1c1714;
  --card-foreground: #fafaf9;
  --primary: #251e19;
  --primary-foreground: #fafaf9;
  --secondary: #e8dfd4;
  --secondary-foreground: #fafaf9;
  --accent: #e8dfd4;
  --accent-foreground: #1c1917;
  --muted: #2a2522;
  --muted-foreground: #a3a3a2;
  --border: #3c3735;
  --destructive: #dc2626;
  --ring: #251e19;
  --radius: 0.5rem;
  --font-sans: ui-sans-serif, system-ui, sans-serif;
  --font-serif: ui-serif, Georgia, serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --spacing: 1rem;
  --shadow: 0 1px 2px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.04);
}

Tailwind

/* powered by Styledex — https://styledex.dev */
/* "Academia (Scholarly Mobile)" from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill (MIT). © Next Level Builder. src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile @ 28b3b8dee8c9. */
/** Tailwind theme extend for Academia (Scholarly Mobile) (uupm-academia-scholarly-mobile) */
module.exports = {
  "theme": {
    "extend": {
      "colors": {
        "background": "#1c1714",
        "foreground": "#fafaf9",
        "card": "#1c1714",
        "primary": "#251e19",
        "primary-foreground": "#fafaf9",
        "secondary": "#e8dfd4",
        "accent": "#e8dfd4",
        "muted": "#2a2522",
        "border": "#3c3735",
        "destructive": "#dc2626",
        "ring": "#251e19"
      },
      "borderRadius": {
        "lg": "0.5rem"
      },
      "fontFamily": {
        "sans": [
          "ui-sans-serif",
          "system-ui",
          "sans-serif"
        ],
        "serif": [
          "ui-serif",
          "Georgia",
          "serif"
        ],
        "mono": [
          "ui-monospace",
          "SFMono-Regular",
          "Menlo",
          "monospace"
        ]
      },
      "boxShadow": {
        "styledex": "0 1px 2px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.04)"
      }
    }
  }
};

shadcn

/* powered by Styledex — https://styledex.dev */
/* "Academia (Scholarly Mobile)" from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill (MIT). © Next Level Builder. src/ui-ux-pro-max/data/styles.csv#academia-scholarly-mobile @ 28b3b8dee8c9. */
@layer base {
:root {
  --background: #1c1714;
  --foreground: #fafaf9;
  --card: #1c1714;
  --card-foreground: #fafaf9;
  --primary: #251e19;
  --primary-foreground: #fafaf9;
  --secondary: #e8dfd4;
  --secondary-foreground: #fafaf9;
  --accent: #e8dfd4;
  --accent-foreground: #1c1917;
  --muted: #2a2522;
  --muted-foreground: #a3a3a2;
  --border: #3c3735;
  --destructive: #dc2626;
  --ring: #251e19;
  --radius: 0.5rem;
  --font-sans: ui-sans-serif, system-ui, sans-serif;
  --font-serif: ui-serif, Georgia, serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --spacing: 1rem;
  --shadow: 0 1px 2px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.04);
}
}