Design health

OpenVibe.Space

97.8 5 files read at 863c7da, Nov 1, 2026.

Spinners0
No reduced motion0
Hand-set timings3
Hand-set curves0
Colours outside the theme29

Where

25 of 32: the ones that cost most, from as many files as possible. Each opens its line on GitHub.

  1. Timingpublic/css/hosting.css:129.hd-tile { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border: 1px solid var(--hd-line); border-radius: 16px; background: var(--hd-card);
  2. Timingpublic/css/spaces.css:39.sp-card { display: flex; flex-direction: column; border: 1px solid var(--border, #2c3d5c); border-radius: 16px; background: var(--bg-secondary, #101828); overf
  3. Timingpublic/css/spaces.css:39.sp-card { display: flex; flex-direction: column; border: 1px solid var(--border, #2c3d5c); border-radius: 16px; background: var(--bg-secondary, #101828); overf
  4. Colourpublic/css/hosting.css:44.hd-badge--accent { color: color-mix(in srgb, var(--accent-light, #60a5fa) 65%, #fff); border-color: color-mix(in srgb, var(--hd-accent) 50%, transparent); back
  5. Colourpublic/css/hosting.css:111.hd-table a { color: color-mix(in srgb, var(--accent-light, #60a5fa) 70%, #fff); }
  6. Colourpublic/css/spaces.css:20.sp-flash.is-bad { border-color: #ef4444; color: #fecaca; background: color-mix(in srgb, #ef4444 12%, transparent); }
  7. Colourpublic/css/spaces.css:20.sp-flash.is-bad { border-color: #ef4444; color: #fecaca; background: color-mix(in srgb, #ef4444 12%, transparent); }
  8. Colourpublic/css/spaces.css:20.sp-flash.is-bad { border-color: #ef4444; color: #fecaca; background: color-mix(in srgb, #ef4444 12%, transparent); }
  9. Colourpublic/css/spaces.css:34.sp-btn-danger { background: transparent; color: #f87171; border-color: color-mix(in srgb, #f87171 50%, transparent); }
  10. Colourpublic/css/spaces.css:34.sp-btn-danger { background: transparent; color: #f87171; border-color: color-mix(in srgb, #f87171 50%, transparent); }
  11. Colourpublic/css/spaces.css:46.sp-card-badge.is-live { color: #4ade80; border-color: color-mix(in srgb, #4ade80 45%, transparent); }
  12. Colourpublic/css/spaces.css:46.sp-card-badge.is-live { color: #4ade80; border-color: color-mix(in srgb, #4ade80 45%, transparent); }
  13. Colourpublic/css/spaces.css:59.sp-template-icon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 18px; color: #fff; background: var(--tpl); }
  14. Colourpublic/css/spaces.css:85.sp-frame { margin: 20px 0 8px; border: 1px solid var(--border, #2c3d5c); border-radius: 16px; overflow: hidden; background: #fff; }
  15. Colourpublic/css/spaces.css:114.sp-ed-tab .sp-ed-x:hover { opacity: 1; color: #f87171; }
  16. Colourpublic/css/spaces.css:121.sp-ed-code .cm-s-default .cm-tag { color: #f472b6; } .sp-ed-code .cm-s-default .cm-attribute { color: #fbbf24; } .sp-ed-code .cm-s-default .cm-string, .sp-ed-c
  17. Colourpublic/css/spaces.css:121.sp-ed-code .cm-s-default .cm-tag { color: #f472b6; } .sp-ed-code .cm-s-default .cm-attribute { color: #fbbf24; } .sp-ed-code .cm-s-default .cm-string, .sp-ed-c
  18. Colourpublic/css/spaces.css:121.sp-ed-code .cm-s-default .cm-tag { color: #f472b6; } .sp-ed-code .cm-s-default .cm-attribute { color: #fbbf24; } .sp-ed-code .cm-s-default .cm-string, .sp-ed-c
  19. Colourpublic/css/spaces.css:122.sp-ed-code .cm-s-default .cm-keyword { color: #c084fc; } .sp-ed-code .cm-s-default .cm-comment { color: #7b8aa3; font-style: italic; } .sp-ed-code .cm-s-defaul
  20. Colourpublic/css/spaces.css:122.sp-ed-code .cm-s-default .cm-keyword { color: #c084fc; } .sp-ed-code .cm-s-default .cm-comment { color: #7b8aa3; font-style: italic; } .sp-ed-code .cm-s-defaul
  21. Colourpublic/css/spaces.css:122.sp-ed-code .cm-s-default .cm-keyword { color: #c084fc; } .sp-ed-code .cm-s-default .cm-comment { color: #7b8aa3; font-style: italic; } .sp-ed-code .cm-s-defaul
  22. Colourpublic/css/spaces.css:123.sp-ed-code .cm-s-default .cm-def, .sp-ed-code .cm-s-default .cm-property { color: #60a5fa; } .sp-ed-code .cm-s-default .cm-variable { color: var(--text-primary
  23. Colourpublic/css/spaces.css:124.sp-ed-code .cm-s-default .cm-variable-2, .sp-ed-code .cm-s-default .cm-variable-3, .sp-ed-code .cm-s-default .cm-type { color: #93c5fd; }
  24. Colourpublic/css/spaces.css:125.sp-ed-code .cm-s-default .cm-atom, .sp-ed-code .cm-s-default .cm-qualifier, .sp-ed-code .cm-s-default .cm-builtin { color: #fcd34d; }
  25. Colourpublic/css/spaces.css:126.sp-ed-code .cm-s-default .cm-meta, .sp-ed-code .cm-s-default .cm-bracket, .sp-ed-code .cm-s-default .cm-operator { color: #a5b4c8; }

Every site · How it is measured · /api/v1/design-health/space