Skip to content

Instantly share code, notes, and snippets.

@samolego

samolego/theme.json

Last active June 25, 2025 13:24
Show Gist options
  • Save samolego/8ad953b7456c40d54cb9d66a3d246f84 to your computer and use it in GitHub Desktop.
Save samolego/8ad953b7456c40d54cb9d66a3d246f84 to your computer and use it in GitHub Desktop.
Download ZIP
Blue theme for OpenCloud
Raw
theme.json
{
"common": {
"name": "OpenCloud",
"slogan": "OpenCloud – Excellent file sharing",
"logo": "themes/opencloud/assets/logo.svg",
"urls": {
"accessDeniedHelp": "",
"imprint": "",
"privacy": ""
},
"shareRoles": {
"b1e2218d-eef8-4d4c-b82d-0f1a1b48f3b5": {
"name": "UnifiedRoleViewer",
"iconName": "eye"
},
"a8d5fe5e-96e3-418d-825b-534dbdf22b99": {
"label": "UnifiedRoleSpaceViewer",
"iconName": "eye"
},
"2d00ce52-1fc2-4dbc-8b95-a73b73395f5a": {
"label": "UnifiedRoleFileEditor",
"iconName": "pencil"
},
"fb6c3e19-e378-47e5-b277-9732f9de6e21": {
"label": "UnifiedRoleEditor",
"iconName": "pencil"
},
"58c63c02-1d89-4572-916a-870abc5a1b7d": {
"label": "UnifiedRoleSpaceEditor",
"iconName": "pencil"
},
"312c0871-5ef7-4b3a-85b6-0e4074c64049": {
"label": "UnifiedRoleManager",
"iconName": "user-star"
},
"1c996275-f1c9-4e71-abdf-a42f6495e960": {
"label": "UnifiedRoleUploader",
"iconName": "upload"
},
"aa97fe03-7980-45ac-9e50-b325749fd7e6": {
"label": "UnifiedRoleSecureView",
"iconName": "shield"
}
}
},
"clients": {
"android": {},
"desktop": {},
"ios": {},
"web": {
"defaults": {
"logo": "themes/opencloud/assets/logo.svg",
"favicon": "themes/opencloud/assets/favicon.svg",
"designTokens": {
"breakpoints": {
"xsmall-max": "",
"small-default": "",
"small-max": "",
"medium-default": "",
"medium-max": "",
"large-default": "",
"large-max": "",
"xlarge": ""
},
"fontSizes": {
"default": "",
"large": "",
"medium": ""
},
"sizes": {
"form-check-default": "",
"height-small": "",
"height-table-row": "",
"icon-default": "",
"max-height-logo": "",
"max-width-logo": "",
"width-medium": "",
"tiles-default": "",
"tiles-resize-step": ""
},
"spacing": {
"xsmall": "",
"small": "",
"medium": "",
"large": "",
"xlarge": "",
"xxlarge": ""
}
}
},
"themes": [
{
"isDark": false,
"label": "Light Theme",
"designTokens": {
"roles": {
"primary": "#eff3f5",
"surfaceTint": "#07677F",
"onPrimary": "#19353F",
"primaryContainer": "#B7EAFF",
"onPrimaryContainer": "#001F28",
"secondary": "#405a6a",
"onSecondary": "#FFFFFF",
"secondaryContainer": "#cde1ed",
"onSecondaryContainer": "#071E26",
"tertiary": "#5A5C7E",
"onTertiary": "#FFFFFF",
"tertiaryContainer": "#E0E0FF",
"onTertiaryContainer": "#171937",
"error": "#BA1A1A",
"onError": "#FFFFFF",
"errorContainer": "#FFDAD6",
"onErrorContainer": "#410002",
"background": "#F5FAFD",
"onBackground": "#122c3a",
"surface": "#FFFFFF",
"onSurface": "#122c3a",
"surfaceVariant": "#DBE4E8",
"onSurfaceVariant": "#40484C",
"outline": "#70787C",
"outlineVariant": "#BFC8CC",
"shadow": "#000000",
"scrim": "#000000",
"inverseSurface": "#2C3134",
"inverseOnSurface": "#EDF1F4",
"inversePrimary": "#88D1EC",
"primaryFixed": "#B7EAFF",
"onPrimaryFixed": "#001F28",
"primaryFixedDim": "#88D1EC",
"onPrimaryFixedVariant": "#004E60",
"secondaryFixed": "#CFE6F1",
"onSecondaryFixed": "#071E26",
"secondaryFixedDim": "#B3CAD4",
"onSecondaryFixedVariant": "#344A52",
"tertiaryFixed": "#E0E0FF",
"onTertiaryFixed": "#171937",
"tertiaryFixedDim": "#C3C3EB",
"onTertiaryFixedVariant": "#424465",
"surfaceDim": "#D6DBDE",
"surfaceBright": "#F5FAFD",
"surfaceContainerLowest": "#FFFFFF",
"surfaceContainerLow": "#EFF4F7",
"surfaceContainer": "#EDF2F5",
"surfaceContainerHigh": "#E4E9EC",
"surfaceContainerHighest": "#DEE3E6",
"chrome": "#0082c8",
"onChrome": "#ffffff"
},
"colorPalette": {
"icon-archive": "#fbbe54",
"icon-audio": "#700460",
"icon-document": "#3b44a6",
"icon-folder": "#ffca28",
"icon-image": "#ee6b3b",
"icon-medical": "#0984db",
"icon-pdf": "#ec0d47",
"icon-presentation": "#ee6b3b",
"icon-spreadsheet": "#15c286",
"icon-video": "#045459"
}
}
}
]
}
}
}
@samolego
Copy link
Author

image

@samolego
Copy link
Author

Make sure to include the theme in the docker:

---
services:
    opencloud:
        image: ${OC_DOCKER_IMAGE:-opencloudeu/opencloud-rolling}:${OC_DOCKER_TAG:-latest}
        container_name: opencloud_server
        # ...
        environment:
            # ...
            # Themes
            WEB_ASSET_THEMES_PATH: /web/themes
            WEB_UI_THEME_PATH: /themes/opencloud/theme.json
        volumes:
            - ./themes:/web/themes

Put the theme in themes directory:

docker-compose.yml
themes/
└── opencloud
    ├── assets
    │   ├── favicon.svg
    │   └── logo.svg
    └── theme.json

You can get logo and favicon from here: https://github.com/opencloud-eu/opencloud/tree/main/services/web/assets/themes/opencloud/assets

I changed them:

  1. favicon
    #20434f -> #0082c8
    #e2baff -> #eff3f5
  2. logo
    #e2baff -> #eff3f5

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment