# Theme

Source: https://swapcard.dev/exhibitor/leads-api/graphql-exhibitor-api-schema/objects/theme


const [open, setOpen] = useState(startOpen);
  return (
    <details {...(open ? { open: true } : {})} className="details" style={{ border:'none', boxShadow:'none', background:'var(--ifm-background-color)' }}>
      <summary
        onClick={(e) => {
          e.preventDefault();
          setOpen((open) => !open);
        }}
        style={{ listStyle:'none' }}
      >
      {open ? dataOpen : dataClose}
      </summary>
      {open && children}
    </details>
  );
};

No description

```graphql
type Theme {
  id: ID!
  name: String
  backgroundImageUrl: String
  mode: ThemeModeEnum
  radius: RadiusEnum
  primaryColor: String
  secondaryColor: String
  textColor: String
  backgroundColor: String
  containerColor: String
  buttonsColor: String
}
```

### Fields

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>id</b></code>](#)<Bullet />[`ID!`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/id) <Badge class="badge badge--secondary" text="non-null"/> <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>name</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>backgroundImageUrl</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>mode</b></code>](#)<Bullet />[`ThemeModeEnum`](/exhibitor/leads-api/graphql-exhibitor-api-schema/enums/theme-mode-enum) <Badge class="badge badge--secondary" text="enum"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>radius</b></code>](#)<Bullet />[`RadiusEnum`](/exhibitor/leads-api/graphql-exhibitor-api-schema/enums/radius-enum) <Badge class="badge badge--secondary" text="enum"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>primaryColor</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>secondaryColor</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>textColor</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>backgroundColor</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>containerColor</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

#### [<code style={{ fontWeight: 'normal' }}>Theme.<b>buttonsColor</b></code>](#)<Bullet />[`String`](/exhibitor/leads-api/graphql-exhibitor-api-schema/scalars/string) <Badge class="badge badge--secondary" text="scalar"/> 
> 
> 
> 
> 

### Member Of

[`ThemeLink`](/exhibitor/leads-api/graphql-exhibitor-api-schema/objects/theme-link)  <Badge class="badge badge--secondary" text="object"/>