Home / File/ gray.json — ui Source File

gray.json — ui Source File

Architecture documentation for gray.json, a json file in the ui codebase.

Entity Profile

Source Code

{
  "inlineColors": {
    "light": {
      "background": "white",
      "foreground": "gray-950",
      "card": "white",
      "card-foreground": "gray-950",
      "popover": "white",
      "popover-foreground": "gray-950",
      "primary": "gray-900",
      "primary-foreground": "gray-50",
      "secondary": "gray-100",
      "secondary-foreground": "gray-900",
      "muted": "gray-100",
      "muted-foreground": "gray-500",
      "accent": "gray-100",
      "accent-foreground": "gray-900",
      "destructive": "red-500",
      "destructive-foreground": "gray-50",
      "border": "gray-200",
      "input": "gray-200",
      "ring": "gray-950"
    },
    "dark": {
      "background": "gray-950",
      "foreground": "gray-50",
      "card": "gray-950",
      "card-foreground": "gray-50",
      "popover": "gray-950",
      "popover-foreground": "gray-50",
      "primary": "gray-50",
      "primary-foreground": "gray-900",
      "secondary": "gray-800",
      "secondary-foreground": "gray-50",
      "muted": "gray-800",
      "muted-foreground": "gray-400",
      "accent": "gray-800",
      "accent-foreground": "gray-50",
      "destructive": "red-900",
      "destructive-foreground": "gray-50",
      "border": "gray-800",
      "input": "gray-800",
      "ring": "gray-300"
    }
  },
  "cssVars": {
    "light": {
      "background": "0 0% 100%",
      "foreground": "224 71.4% 4.1%",
      "card": "0 0% 100%",
      "card-foreground": "224 71.4% 4.1%",
      "popover": "0 0% 100%",
      "popover-foreground": "224 71.4% 4.1%",
      "primary": "220.9 39.3% 11%",
      "primary-foreground": "210 20% 98%",
      "secondary": "220 14.3% 95.9%",
      "secondary-foreground": "220.9 39.3% 11%",
      "muted": "220 14.3% 95.9%",
      "muted-foreground": "220 8.9% 46.1%",
      "accent": "220 14.3% 95.9%",
      "accent-foreground": "220.9 39.3% 11%",
      "destructive": "0 84.2% 60.2%",
      "destructive-foreground": "210 20% 98%",
      "border": "220 13% 91%",
      "input": "220 13% 91%",
      "ring": "224 71.4% 4.1%",
      "chart-1": "12 76% 61%",
      "chart-2": "173 58% 39%",
      "chart-3": "197 37% 24%",
      "chart-4": "43 74% 66%",
      "chart-5": "27 87% 67%"
    },
    "dark": {
      "background": "224 71.4% 4.1%",
      "foreground": "210 20% 98%",
      "card": "224 71.4% 4.1%",
      "card-foreground": "210 20% 98%",
      "popover": "224 71.4% 4.1%",
      "popover-foreground": "210 20% 98%",
      "primary": "210 20% 98%",
      "primary-foreground": "220.9 39.3% 11%",
      "secondary": "215 27.9% 16.9%",
      "secondary-foreground": "210 20% 98%",
      "muted": "215 27.9% 16.9%",
      "muted-foreground": "217.9 10.6% 64.9%",
      "accent": "215 27.9% 16.9%",
      "accent-foreground": "210 20% 98%",
      "destructive": "0 62.8% 30.6%",
      "destructive-foreground": "210 20% 98%",
      "border": "215 27.9% 16.9%",
      "input": "215 27.9% 16.9%",
      "ring": "216 12.2% 83.9%",
      "chart-1": "220 70% 50%",
      "chart-2": "160 60% 45%",
      "chart-3": "30 80% 55%",
      "chart-4": "280 65% 60%",
      "chart-5": "340 75% 55%"
    }
  },
  "inlineColorsTemplate": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n  ",
  "cssVarsTemplate": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n@layer base {\n  :root {\n    --background: 0 0% 100%;\n    --foreground: 224 71.4% 4.1%;\n    --card: 0 0% 100%;\n    --card-foreground: 224 71.4% 4.1%;\n    --popover: 0 0% 100%;\n    --popover-foreground: 224 71.4% 4.1%;\n    --primary: 220.9 39.3% 11%;\n    --primary-foreground: 210 20% 98%;\n    --secondary: 220 14.3% 95.9%;\n    --secondary-foreground: 220.9 39.3% 11%;\n    --muted: 220 14.3% 95.9%;\n    --muted-foreground: 220 8.9% 46.1%;\n    --accent: 220 14.3% 95.9%;\n    --accent-foreground: 220.9 39.3% 11%;\n    --destructive: 0 84.2% 60.2%;\n    --destructive-foreground: 210 20% 98%;\n    --border: 220 13% 91%;\n    --input: 220 13% 91%;\n    --ring: 224 71.4% 4.1%;\n    --radius: 0.5rem;\n    --chart-1: 12 76% 61%;\n    --chart-2: 173 58% 39%;\n    --chart-3: 197 37% 24%;\n    --chart-4: 43 74% 66%;\n    --chart-5: 27 87% 67%;\n  }\n\n  .dark {\n    --background: 224 71.4% 4.1%;\n    --foreground: 210 20% 98%;\n    --card: 224 71.4% 4.1%;\n    --card-foreground: 210 20% 98%;\n    --popover: 224 71.4% 4.1%;\n    --popover-foreground: 210 20% 98%;\n    --primary: 210 20% 98%;\n    --primary-foreground: 220.9 39.3% 11%;\n    --secondary: 215 27.9% 16.9%;\n    --secondary-foreground: 210 20% 98%;\n    --muted: 215 27.9% 16.9%;\n    --muted-foreground: 217.9 10.6% 64.9%;\n    --accent: 215 27.9% 16.9%;\n    --accent-foreground: 210 20% 98%;\n    --destructive: 0 62.8% 30.6%;\n    --destructive-foreground: 210 20% 98%;\n    --border: 215 27.9% 16.9%;\n    --input: 215 27.9% 16.9%;\n    --ring: 216 12.2% 83.9%;\n    --chart-1: 220 70% 50%;\n    --chart-2: 160 60% 45%;\n    --chart-3: 30 80% 55%;\n    --chart-4: 280 65% 60%;\n    --chart-5: 340 75% 55%;\n  }\n}\n\n@layer base {\n  * {\n    @apply border-border;\n  }\n  body {\n    @apply bg-background text-foreground;\n  }\n}"
}

Frequently Asked Questions

What does gray.json do?
gray.json is a source file in the ui codebase, written in json.
Where is gray.json in the architecture?
gray.json is located at deprecated/www/public/registry/colors/gray.json (directory: deprecated/www/public/registry/colors).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free