Deploy from stable branch

.gitattributes

@@ -0,0 +1,35 @@
+*.7z filter=lfs diff=lfs merge=lfs -text
+*.arrow filter=lfs diff=lfs merge=lfs -text
+*.bin filter=lfs diff=lfs merge=lfs -text
+*.bz2 filter=lfs diff=lfs merge=lfs -text
+*.ckpt filter=lfs diff=lfs merge=lfs -text
+*.ftz filter=lfs diff=lfs merge=lfs -text
+*.gz filter=lfs diff=lfs merge=lfs -text
+*.h5 filter=lfs diff=lfs merge=lfs -text
+*.joblib filter=lfs diff=lfs merge=lfs -text
+*.lfs.* filter=lfs diff=lfs merge=lfs -text
+*.mlmodel filter=lfs diff=lfs merge=lfs -text
+*.model filter=lfs diff=lfs merge=lfs -text
+*.msgpack filter=lfs diff=lfs merge=lfs -text
+*.npy filter=lfs diff=lfs merge=lfs -text
+*.npz filter=lfs diff=lfs merge=lfs -text
+*.onnx filter=lfs diff=lfs merge=lfs -text
+*.ot filter=lfs diff=lfs merge=lfs -text
+*.parquet filter=lfs diff=lfs merge=lfs -text
+*.pb filter=lfs diff=lfs merge=lfs -text
+*.pickle filter=lfs diff=lfs merge=lfs -text
+*.pkl filter=lfs diff=lfs merge=lfs -text
+*.pt filter=lfs diff=lfs merge=lfs -text
+*.pth filter=lfs diff=lfs merge=lfs -text
+*.rar filter=lfs diff=lfs merge=lfs -text
+*.safetensors filter=lfs diff=lfs merge=lfs -text
+saved_model/**/* filter=lfs diff=lfs merge=lfs -text
+*.tar.* filter=lfs diff=lfs merge=lfs -text
+*.tar filter=lfs diff=lfs merge=lfs -text
+*.tflite filter=lfs diff=lfs merge=lfs -text
+*.tgz filter=lfs diff=lfs merge=lfs -text
+*.wasm filter=lfs diff=lfs merge=lfs -text
+*.xz filter=lfs diff=lfs merge=lfs -text
+*.zip filter=lfs diff=lfs merge=lfs -text
+*.zst filter=lfs diff=lfs merge=lfs -text
+*tfevents* filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -0,0 +1,173 @@
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py,cover
+.hypothesis/
+.pytest_cache/
+cover/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+db.sqlite3-journal
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+.pybuilder/
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+#   For a library or package, you might want to ignore these files since the code is
+#   intended to run in multiple environments; otherwise, check them in:
+# .python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# UV
+#   Similar to Pipfile.lock, it is generally recommended to include uv.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#uv.lock
+
+# poetry
+#   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
+#poetry.lock
+
+# pdm
+#   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
+#pdm.lock
+#   pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
+#   in version control.
+#   https://pdm.fming.dev/latest/usage/project/#working-with-version-control
+.pdm.toml
+.pdm-python
+.pdm-build/
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# Cython debug symbols
+cython_debug/
+
+# PyCharm
+#  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
+#  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
+#  and can be added to the global gitignore or merged into this file.  For a more nuclear
+#  option (not recommended) you can uncomment the following to ignore the entire idea folder.
+#.idea/
+
+
+# Boilerplate specific ignores
+.gradio/
+.ruff_cache/

.gitlint

@@ -0,0 +1,143 @@
+# Edit this file as you like.
+#
+# All these sections are optional. Each section with the exception of [general] represents
+# one rule and each key in it is an option for that specific rule.
+#
+# Rules and sections can be referenced by their full name or by id. For example
+# section "[body-max-line-length]" could also be written as "[B1]". Full section names are
+# used in here for clarity.
+#
+# [general]
+# Ignore certain rules, this example uses both full name and id
+# ignore=title-trailing-punctuation, T3
+
+[general]
+# You HAVE to add the rule here to enable it, only configuring (such as below)
+# does NOT enable it.
+contrib=contrib-title-conventional-commits
+
+[contrib-title-conventional-commits]
+# Specify allowed commit types. For details see: https://www.conventionalcommits.org/
+types = build,chore,ci,docs,feat,fix,perf,refactor,revert,style,test
+
+# verbosity should be a value between 1 and 3, the commandline -v flags take precedence over this
+# verbosity = 2
+
+# By default gitlint will ignore merge, revert, fixup and squash commits.
+# ignore-merge-commits=true
+# ignore-revert-commits=true
+# ignore-fixup-commits=true
+# ignore-squash-commits=true
+
+# Ignore any data send to gitlint via stdin
+# ignore-stdin=true
+
+# Fetch additional meta-data from the local repository when manually passing a
+# commit message to gitlint via stdin or --commit-msg. Disabled by default.
+# staged=true
+
+# Hard fail when the target commit range is empty. Note that gitlint will
+# already fail by default on invalid commit ranges. This option is specifically
+# to tell gitlint to fail on *valid but empty* commit ranges.
+# Disabled by default.
+# fail-without-commits=true
+
+# Enable debug mode (prints more output). Disabled by default.
+# debug=true
+
+# Enable community contributed rules
+# See http://jorisroovers.github.io/gitlint/contrib_rules for details
+# contrib=contrib-title-conventional-commits,CC1
+
+# Set the extra-path where gitlint will search for user defined rules
+# See http://jorisroovers.github.io/gitlint/user_defined_rules for details
+# extra-path=examples/
+
+# This is an example of how to configure the "title-max-length" rule and
+# set the line-length it enforces to 50
+# [title-max-length]
+# line-length=50
+
+# Conversely, you can also enforce minimal length of a title with the
+# "title-min-length" rule:
+# [title-min-length]
+# min-length=5
+
+# [title-must-not-contain-word]
+# Comma-separated list of words that should not occur in the title. Matching is case
+# insensitive. It's fine if the keyword occurs as part of a larger word (so "WIPING"
+# will not cause a violation, but "WIP: my title" will.
+# words=wip
+
+# [title-match-regex]
+# python-style regex that the commit-msg title must match
+# Note that the regex can contradict with other rules if not used correctly
+# (e.g. title-must-not-contain-word).
+# regex=^US[0-9]*
+
+# [body-max-line-length]
+# line-length=72
+
+# [body-min-length]
+# min-length=5
+
+# [body-is-missing]
+# Whether to ignore this rule on merge commits (which typically only have a title)
+# default = True
+# ignore-merge-commits=false
+
+# [body-changed-file-mention]
+# List of files that need to be explicitly mentioned in the body when they are changed
+# This is useful for when developers often erroneously edit certain files or git submodules.
+# By specifying this rule, developers can only change the file when they explicitly reference
+# it in the commit message.
+# files=gitlint-core/gitlint/rules.py,README.md
+
+# [body-match-regex]
+# python-style regex that the commit-msg body must match.
+# E.g. body must end in My-Commit-Tag: foo
+# regex=My-Commit-Tag: foo$
+
+# [author-valid-email]
+# python-style regex that the commit author email address must match.
+# For example, use the following regex if you only want to allow email addresses from foo.com
+# regex=[^@]+@foo.com
+
+# [ignore-by-title]
+# Ignore certain rules for commits of which the title matches a regex
+# E.g. Match commit titles that start with "Release"
+# regex=^Release(.*)
+
+# Ignore certain rules, you can reference them by their id or by their full name
+# Use 'all' to ignore all rules
+# ignore=T1,body-min-length
+
+# [ignore-by-body]
+# Ignore certain rules for commits of which the body has a line that matches a regex
+# E.g. Match bodies that have a line that that contain "release"
+# regex=(.*)release(.*)
+#
+# Ignore certain rules, you can reference them by their id or by their full name
+# Use 'all' to ignore all rules
+# ignore=T1,body-min-length
+
+# [ignore-body-lines]
+# Ignore certain lines in a commit body that match a regex.
+# E.g. Ignore all lines that start with 'Co-Authored-By'
+# regex=^Co-Authored-By
+
+# [ignore-by-author-name]
+# Ignore certain rules for commits of which the author name matches a regex
+# E.g. Match commits made by dependabot
+# regex=(.*)dependabot(.*)
+#
+# Ignore certain rules, you can reference them by their id or by their full name
+# Use 'all' to ignore all rules
+# ignore=T1,body-min-length
+
+# This is a contrib rule - a community contributed rule. These are disabled by default.
+# You need to explicitly enable them one-by-one by adding them to the "contrib" option
+# under [general] section above.
+# [contrib-title-conventional-commits]
+# Specify allowed commit types. For details see: https://www.conventionalcommits.org/
+# types = bugfix,user-story,epic

.pre-commit-config.yaml

@@ -0,0 +1,48 @@
+repos:
+  - repo: https://github.com/pre-commit/pre-commit-hooks
+    rev: v5.0.0
+    hooks:
+      - id: check-added-large-files
+      - id: check-ast
+      - id: check-case-conflict
+      - id: check-json
+      - id: check-merge-conflict
+      - id: check-toml
+      - id: end-of-file-fixer
+  - repo: https://github.com/astral-sh/ruff-pre-commit
+    # Ruff version.
+    rev: v0.8.6
+    hooks:
+      - id: ruff
+  - repo: https://github.com/pycqa/isort
+    rev: 5.13.2
+    hooks:
+      - id: isort
+        args: ["--profile", "black"]
+  - repo: https://github.com/asottile/pyupgrade
+    rev: v3.19.1
+    hooks:
+      - id: pyupgrade
+        args: ["--py310-plus"]
+  - repo: https://github.com/psf/black
+    rev: 24.10.0
+    hooks:
+      - id: black
+        args:
+          - --line-length=120
+  - repo: https://github.com/jorisroovers/gitlint
+    rev:  v0.19.1
+    hooks:
+    -   id: gitlint
+        name: gitlint
+        language: python
+        entry: gitlint
+        args: [--staged, --msg-filename]
+        stages: [commit-msg]
+  - repo: https://github.com/astral-sh/uv
+    rev: '0.5.3'
+    hooks:
+      - id: uv-lock
+      - id: uv-export
+        name: uv export for base requirements
+        args: [--no-hashes, --format, requirements.txt, --output, requirements.txt]

DEVELOPMENT.md

@@ -0,0 +1,154 @@
+# IBM Research Hugging Face Spaces gradio template
+
+This template repository lets you quickly build a gradio Hugging Face spaces demo for the [ibm-granite org](https://huggingface.co/ibm-granite). It is set up with the requirements and theming for the ibm-granite org as well as pre-commit hooks and linting configuration to maintain a consistent code standard across all demos.
+
+## 👩‍💻 Introduction
+
+To deploy demos to the ibm-granite org on Hugging Face, you will be working with the Research Design Technical Experiences (RDTE) team via this GitHub org. You will not gain write access to Hugging Face org as there are limited seats available for those who are able to contribute. Hence, with read-only access you will work via the RDTE team (who have write access) to create and deploy demos to Hugging Face.
+
+## 🛠️ Getting started
+
+This is the place to start when building gradio demos for IBM Granite. Complete the following steps to get a repository set up and configured for your demo as well as the deployment pipeline to validate and push it to Hugging Face spaces.
+
+1. [Raise an onboarding request](https://github.ibm.com/ibm-huggingface-space-demos/deployment/issues/new?assignees=james-sutton,gwhite&labels=onboarding%2Ctriage&projects=&template=onboarding.yaml&title=%5BOnboarding%5D%3A+). Please fill out the linked template to request a new repository be set up for you in this org and to give access to anything else required. You can always add more contributors later if needed.
+2. Once your repository has been created, please either update it with your existing demo if you have one, or have a play with the example and modify it to create your new demo. You'll be working in the `main` branch whilst developing your demo.
+3. Make sure that you follow the [development guide](#development-guide) and use the pre-configured pre-commit hooks before every commit and push. The validation pipeline will independently gate demos based on these hooks, so to avoid any deployment delays, it's best to run the checks with every commit.
+4. Once you are happy with your demo and want to get it deployed to Hugging Face spaces in the ibm-granite org, open a pull request to merge the `main` branch into the `stable` branch. This will trigger a build and stage a deployment so that you and the RDTE team can validate the demo works well both from a technical and UX standpoint. If your demo needs any custom environment variables or secrets, let the RDTE team know and we will contact you directly to get them added to the Space configuration on Hugging Face.
+5. Once the Pull request has been approved, you can merge it into the `stable` branch. A deployment will then push your changes into the Hugging Face spaces git repository and your demo will then be available.
+
+## 🛠️ Development guide
+
+Further information on developing the code in this repository is provided below.
+
+### Create a code repository
+
+[Use this template](https://github.ibm.com/new?template_name=gradio-template&template_owner=ibm-huggingface-space-demos) to create a new code repository for your demo. This could initially live somewhere else on GitHub if you wish but the RDTE team can also create a repository for you within this [ibm-hugging-face-space-demos](https://github.ibm.com/ibm-huggingface-space-demos) org.
+
+Once your code repo has been created on GitHub (from this template), clone the repository to your local machine.
+
+### Prerequisites
+
+Some things you will need to do on your machine before developing.
+
+#### Precommit
+
+[Precommit](https://pre-commit.com) is a tool that adds git commit hooks. You will need to [install](https://pre-commit.com/#install) it on your machine and then run within your code repository:
+
+```shell
+pre-commit install
+```
+
+You can manually run pre-commit using the following command:
+
+```shell
+# To run against staged files:
+pre-commit run
+
+# If you want to run against staged and unstaged files:
+pre-commit run --all-files
+```
+
+It is important to run the pre-commit hooks and fix any files that fail before you commit and push to the repository as the pull request build will fail any PR that does not adhere to them i.e. the RDTE team will only accept your code for deployment to Hugging Face once it has passed all of the pre-commit checks.
+
+#### Poetry
+
+[Poetry](https://python-poetry.org/) is a tool for Python packaging, dependency and virtual environment management that is used to manage the development of this project. You will need to install Poetry locally. There are several ways to install it including through the package manager of your operating system, however, the easiest way to install is likely using their installer, as follows:
+
+```shell
+curl -sSL https://install.python-poetry.org | python3 -
+```
+
+You can also use `pip` and `pipx` to install poetry, the details of which are at https://python-poetry.org/docs/
+
+Once installed, the project is configured and controlled via the `pyproject.toml` file with the current dependency tree stored in `poetry.lock`. You may also [configure poetry](https://python-poetry.org/docs/configuration/) further if you wish but there is no need to do so as the default options are sufficient. You may, however, wish to change some of the options set in this template:
+| Setting | Notes |
+| ------- | ----- |
+| name | **Update this**, to reflect the name of your demo |
+| version | **Update this**, to reflect the current version of your demo |
+| description | **Update this**, to a short description of your demo |
+| authors | **Update this**, to the list of authors of your demo |
+
+## Install and run locally
+
+To get set up ready to run the code in development mode:
+
+```shell
+# create and activate a python virtual environment
+poetry shell
+poetry install
+
+# run the demo locally
+python src/app.py
+```
+
+## Testing
+
+Each demo should have unit tests to validate that the generate functions work correctly, these can be stubbed out so that a GPU is not required. The UX elements will be tested manually in the staging environment.
+
+1. Fork this template
+2. Update the `.spaces-conf.yaml` with the correct metadata for your project. If you don't know what the fields should be, contact the Research Design Technical Experiences Team.
+3. Create a virtual environment and install dependencies using poetry
+4. Run some updates to make sure everything is up-to-date
+5. Run the example code locally.
+
+## Documenting your demo
+
+If you would like to write some information/documentation about your demo that is intended for developers or other people that might want to run the demo from scratch, please use the [README.md](README.md) file, leaving the Hugging Face Spaces configuration header in place at the top of the file.
+
+### Hugging face spaces configuration settings
+
+Hugging Face allow the configuration of spaces demonstrations via the [README.md](README.md) file in the root of the project. There is a [Spaces Configuration Reference](https://huggingface.co/docs/hub/en/spaces-config-reference) guide that you can use to gain an understanding of the configuration options that can be specified here.
+
+The template has a set of initial defaults, similar to these:
+
+```
+---
+title: Granite 3.0 Chat
+colorFrom: blue
+colorTo: indigo
+sdk: gradio
+sdk_version: 5.9.1
+app_file: src/app.py
+pinned: false
+license: apache-2.0
+short_description: Chat with IBM Granite 3.0
+---
+```
+
+#### Options
+
+The default options specified above:
+| Setting | Notes |
+| ------- | ----- |
+| title | **Update this**, keep this short (recommend max 24 chars), this information is displayed in the centre of the demo description card |
+| emoji | Do not update this, our demos will use a consistent emoji character |
+| colorFrom | Do not update this, used in combination with colorTo to colourize the demo description card |
+| colorTo | see colorFrom |
+| sdk | Do not update this, our Gradio demos will always use the "gradio" setting |
+| sdk_version | Update this if necessary for your demo to function, ideally should be set to the latest gradio version |
+| app_file | Update this if necessary for your demo to function, should be set to the path of the main entry point to the demo |
+| license | Do not update this, our demos are to always be apache-2.0 licensed |
+| short_description | **Update this**, should be set to a few words that describe the demo in a little more detail than the title, this information is displayed in the bottom-right of the demo description card |
+
+Other available options:
+| Setting | Notes |
+| ------- | ----- |
+| python_version | You may optionally set this, best advice is to use the default Python version if possible (current default is Python 3.10) |
+| suggested_hardware | Do not use this, unlikely to be required as demos run on ZeroGPU |
+| suggested_storage | Do not use this, our demos do not require storage |
+| app_port | Do not use this, not relevant for gradio demos |
+| base_path | Do not use this, use the app_file setting |
+| fullWidth | Do not use this, our demos will use a consistent default width |
+| header | Do not use this, our demos will use a consistent header |
+| models | Do not use this, let their parsing discover these from our code |
+| datasets | Do not use this, let their parsing discover these from our code |
+| tags | Do not use this, we are not tagging our demos |
+| thumbnail | Do not use this, provides a thumbnail for social sharing of demos |
+| pinned | Do not use this, the RDTE team will change this setting if it's deemed necessary |
+| hf_oauth | Do not use this, we are not using OAuth |
+| hf_oauth_scopes | Do not use this, we are not using OAuth |
+| hf_oauth_expiration_minutes | Do not use this, we are not using OAuth |
+| disable_embedding | Do not use this, leave at the default that allows embedding to take place |
+| startup_duration_timeout | Do not use this, leave at the default 30 minutes |
+| custom_headers | Do not use this, we do not need to add any custom HTTP headers |
+| preload_from_hub | Do not use this, specifying this builds the models and data sets into the container image with the goal of making start up times faster due to not needing to download them each time. However, RDTE testing indicates this setting significantly increases the start up time for our relatively small Granite models |

README.md

@@ -0,0 +1,12 @@
+---
+title: Granite 3.1 8b Instruct
+emoji: 📝
+colorFrom: blue
+colorTo: indigo
+sdk: gradio
+sdk_version: 5.9.1
+app_file: src/app.py
+pinned: false
+license: apache-2.0
+short_description: Chat with IBM Granite 3.1 8b Instruct
+---

pyproject.toml

@@ -0,0 +1,57 @@
+[project]
+name = "granite-3.1-8b-instruct"
+version = "0.1.0"
+description = "A demo of the IBM Granite 3.1 8b instruct model"
+authors = [
+    { name = "James Sutton", email = "james.sutton@uk.ibm.com" },
+    { name = "Graham White", email = "gwhite@uk.ibm.com" },
+    { name = "Michael Desmond", email = "mdesmond@us.ibm.com" },
+]
+license = { text = "Apache-2.0" }
+readme = "README.md"
+requires-python = ">=3.10,<3.11"
+dependencies = [
+    "gradio==5.9.1",
+    "torch==2.10.0",
+    "spaces==0.50.2",
+    "transformers==4.47.1",
+    "accelerate==1.2.1",
+    "pydantic==2.10.6",
+]
+
+[project.optional-dependencies]
+dev = [
+    "pre-commit>=4.0.1",
+    "git-lint>=0.1.2",
+    "ruff>=0.8.3",
+    "pytest>=8.3.4",
+]
+
+
+[tool.ruff]
+select = [
+    "E",   # pycodestyle
+    "F",   # pyflakes
+    "UP",  # pyupgrade
+    "D",   # pydocstyle
+    "I",   # isort
+    "B",   # bugbear
+    "ANN", # annotations
+    "N",   # pep8-naming
+    "C4",  # Comprehensions
+    "DTZ", # DatetimeZ
+    "Q",   # Quotes
+    "SIM", # Simplify
+    "RUF", # Ruff
+]
+ignore = ["D203", "D213"]
+fixable = ["ALL"]
+unfixable = []
+line-length = 120
+
+
+[tool.black]
+line-length = 120
+
+[tool.ruff.lint.pydocstyle]
+convention = "google"

requirements.txt

@@ -0,0 +1,261 @@
+# This file was autogenerated by uv via the following command:
+#    uv export --format requirements.txt --no-hashes
+accelerate==1.2.1
+    # via granite-3-1-8b-instruct
+aiofiles==23.2.1
+    # via gradio
+annotated-doc==0.0.4
+    # via
+    #   fastapi
+    #   typer
+annotated-types==0.7.0
+    # via pydantic
+anyio==4.13.0
+    # via
+    #   gradio
+    #   httpx
+    #   starlette
+certifi==2026.4.22
+    # via
+    #   httpcore
+    #   httpx
+    #   requests
+charset-normalizer==3.4.7
+    # via requests
+click==8.3.3 ; sys_platform != 'emscripten'
+    # via
+    #   typer
+    #   uvicorn
+colorama==0.4.6 ; sys_platform == 'win32'
+    # via
+    #   click
+    #   tqdm
+cuda-bindings==12.9.4 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+cuda-pathfinder==1.5.4 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via cuda-bindings
+exceptiongroup==1.3.1
+    # via anyio
+fastapi==0.136.1
+    # via gradio
+ffmpy==1.0.0
+    # via gradio
+filelock==3.29.0
+    # via
+    #   huggingface-hub
+    #   torch
+    #   transformers
+fsspec==2026.4.0
+    # via
+    #   gradio-client
+    #   huggingface-hub
+    #   torch
+gradio==5.9.1
+    # via
+    #   granite-3-1-8b-instruct
+    #   spaces
+gradio-client==1.5.2
+    # via gradio
+h11==0.16.0
+    # via
+    #   httpcore
+    #   uvicorn
+hf-xet==1.5.0 ; platform_machine == 'aarch64' or platform_machine == 'amd64' or platform_machine == 'arm64' or platform_machine == 'x86_64'
+    # via huggingface-hub
+httpcore==1.0.9
+    # via httpx
+httpx==0.28.1
+    # via
+    #   gradio
+    #   gradio-client
+    #   safehttpx
+    #   spaces
+huggingface-hub==0.36.2
+    # via
+    #   accelerate
+    #   gradio
+    #   gradio-client
+    #   tokenizers
+    #   transformers
+idna==3.15
+    # via
+    #   anyio
+    #   httpx
+    #   requests
+jinja2==3.1.6
+    # via
+    #   gradio
+    #   torch
+markdown-it-py==4.2.0 ; sys_platform != 'emscripten'
+    # via rich
+markupsafe==2.1.5
+    # via
+    #   gradio
+    #   jinja2
+mdurl==0.1.2 ; sys_platform != 'emscripten'
+    # via markdown-it-py
+mpmath==1.3.0
+    # via sympy
+networkx==3.4.2
+    # via torch
+numpy==2.2.6
+    # via
+    #   accelerate
+    #   gradio
+    #   pandas
+    #   transformers
+nvidia-cublas-cu12==12.8.4.1 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via
+    #   nvidia-cudnn-cu12
+    #   nvidia-cusolver-cu12
+    #   torch
+nvidia-cuda-cupti-cu12==12.8.90 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-cuda-nvrtc-cu12==12.8.93 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-cuda-runtime-cu12==12.8.90 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-cudnn-cu12==9.10.2.21 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-cufft-cu12==11.3.3.83 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-cufile-cu12==1.13.1.3 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-curand-cu12==10.3.9.90 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-cusolver-cu12==11.7.3.90 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-cusparse-cu12==12.5.8.93 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via
+    #   nvidia-cusolver-cu12
+    #   torch
+nvidia-cusparselt-cu12==0.7.1 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-nccl-cu12==2.27.5 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-nvjitlink-cu12==12.8.93 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via
+    #   nvidia-cufft-cu12
+    #   nvidia-cusolver-cu12
+    #   nvidia-cusparse-cu12
+    #   torch
+nvidia-nvshmem-cu12==3.4.5 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+nvidia-nvtx-cu12==12.8.90 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+orjson==3.11.9
+    # via gradio
+packaging==26.2
+    # via
+    #   accelerate
+    #   gradio
+    #   gradio-client
+    #   huggingface-hub
+    #   spaces
+    #   transformers
+pandas==2.3.3
+    # via gradio
+pillow==11.3.0
+    # via gradio
+psutil==7.2.2
+    # via accelerate
+pydantic==2.10.6
+    # via
+    #   fastapi
+    #   gradio
+    #   granite-3-1-8b-instruct
+    #   spaces
+pydantic-core==2.27.2
+    # via pydantic
+pydub==0.25.1
+    # via gradio
+pygments==2.20.0 ; sys_platform != 'emscripten'
+    # via rich
+python-dateutil==2.9.0.post0
+    # via pandas
+python-multipart==0.0.28
+    # via gradio
+pytz==2026.2
+    # via pandas
+pyyaml==6.0.3
+    # via
+    #   accelerate
+    #   gradio
+    #   huggingface-hub
+    #   transformers
+regex==2026.5.9
+    # via transformers
+requests==2.34.2
+    # via
+    #   huggingface-hub
+    #   spaces
+    #   transformers
+rich==15.0.0 ; sys_platform != 'emscripten'
+    # via typer
+ruff==0.15.13 ; sys_platform != 'emscripten'
+    # via gradio
+safehttpx==0.1.7
+    # via gradio
+safetensors==0.7.0
+    # via
+    #   accelerate
+    #   transformers
+semantic-version==2.10.0
+    # via gradio
+shellingham==1.5.4 ; sys_platform != 'emscripten'
+    # via typer
+six==1.17.0
+    # via python-dateutil
+spaces==0.50.2
+    # via granite-3-1-8b-instruct
+starlette==0.52.1
+    # via
+    #   fastapi
+    #   gradio
+sympy==1.14.0
+    # via torch
+tokenizers==0.21.4
+    # via transformers
+tomlkit==0.13.3
+    # via gradio
+torch==2.10.0
+    # via
+    #   accelerate
+    #   granite-3-1-8b-instruct
+tqdm==4.67.3
+    # via
+    #   huggingface-hub
+    #   transformers
+transformers==4.47.1
+    # via granite-3-1-8b-instruct
+triton==3.6.0 ; platform_machine == 'x86_64' and sys_platform == 'linux'
+    # via torch
+typer==0.25.1 ; sys_platform != 'emscripten'
+    # via gradio
+typing-extensions==4.15.0
+    # via
+    #   anyio
+    #   exceptiongroup
+    #   fastapi
+    #   gradio
+    #   gradio-client
+    #   huggingface-hub
+    #   pydantic
+    #   pydantic-core
+    #   spaces
+    #   starlette
+    #   torch
+    #   typing-inspection
+    #   uvicorn
+typing-inspection==0.4.2
+    # via fastapi
+tzdata==2026.2
+    # via pandas
+urllib3==2.7.0
+    # via
+    #   gradio
+    #   requests
+uvicorn==0.47.0 ; sys_platform != 'emscripten'
+    # via gradio
+websockets==14.2
+    # via gradio-client

src/app.css

@@ -0,0 +1,75 @@
+/* Hide the standard Gradio footer */
+footer {
+    display: none !important;
+}
+/* Make the text in the input box and chat label bigger */
+textarea, .wrapper > label {
+    font-size: var(--text-md)
+}
+.input-container {
+    align-items: center;
+}
+/* Make the chat label bold */
+.wrapper > label {
+    font-weight: 600;
+}
+/* Limit the overall width of the demo */
+.gradio-container {
+    max-width: 1024px !important;
+    margin: 5vh auto !important;
+}
+/* Theme anchor links with Carbon coloring */
+.gr_docs_link a, .gr_docs_link a > i {
+    color: #78A9FF;
+    text-decoration: none;
+}
+/* Title alignment with the Granite icon */
+.gr_title {
+    display: flex;
+    align-items: center;
+    margin-bottom: -0.5rem;
+}
+.gr_title img {
+    height: 42px;
+    width: 42px;
+    margin-right: 1rem;
+    filter: invert(0%) sepia(0%) saturate(7459%) hue-rotate(154deg) brightness(96%) contrast(100%);
+}
+.gr_title h1 {
+    margin: auto !important;
+    font-size: 36px;
+    font-weight: 600;
+}
+/* Only one form on the page, within the Accordion component */
+.form {
+    flex-direction: row;
+    background-color: var(--block-background-fill);
+}
+.gr_accordion_element {
+    width: 50%;
+    margin: 0px;
+}
+/* Color the example background */
+.example:hover {
+    background-color: #D0E2FF
+}
+/* Centre the example text within the example box */
+.example-text-content {
+    margin-top: auto;
+    margin-bottom: auto;
+}
+/* Centre the values in advanced settings */
+.tab-like-container  {
+    align-items: center;
+}
+/* dark mode */
+@media (prefers-color-scheme: dark) {
+    /* Color the Granite icon in white */
+    .gr_title img {
+        filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(162deg) brightness(101%) contrast(104%);
+    }
+    /* Color the example background */
+    .example:hover {
+        background-color: #4589FF
+    }
+}

src/app.py

@@ -0,0 +1,213 @@
+"""Template Demo for IBM Granite Hugging Face spaces."""
+
+from collections.abc import Iterator
+from datetime import datetime
+from pathlib import Path
+from threading import Thread
+
+import gradio as gr
+import spaces
+import torch
+from transformers import AutoModelForCausalLM, AutoTokenizer, TextIteratorStreamer
+
+from themes.research_monochrome import theme
+
+today_date = datetime.today().strftime("%B %-d, %Y")  # noqa: DTZ002
+
+SYS_PROMPT = f"""Knowledge Cutoff Date: April 2024.
+Today's Date: {today_date}.
+You are Granite, developed by IBM. You are a helpful AI assistant"""
+TITLE = "IBM Granite 3.1 8b Instruct"
+DESCRIPTION = """
+<p>Granite 3.1 8b instruct is an open-source LLM supporting a 128k context window. Start with one of the sample prompts
+or enter your own. Keep in mind that AI can occasionally make mistakes.
+<span class="gr_docs_link">
+<a href="https://www.ibm.com/granite/docs/">View Documentation <i class="fa fa-external-link"></i></a>
+</span>
+</p>
+"""
+MAX_INPUT_TOKEN_LENGTH = 128_000
+MAX_NEW_TOKENS = 1024
+TEMPERATURE = 0.7
+TOP_P = 0.85
+TOP_K = 50
+REPETITION_PENALTY = 1.05
+
+if not torch.cuda.is_available():
+    print("This demo may not work on CPU.")
+
+model = AutoModelForCausalLM.from_pretrained(
+    "ibm-granite/granite-3.1-8b-instruct", torch_dtype=torch.float16, device_map="auto"
+)
+tokenizer = AutoTokenizer.from_pretrained("ibm-granite/granite-3.1-8b-instruct")
+tokenizer.use_default_system_prompt = False
+tokenizer.pad_token = tokenizer.eos_token
+
+
+@spaces.GPU
+def generate(
+    message: str,
+    chat_history: list[dict],
+    temperature: float = TEMPERATURE,
+    repetition_penalty: float = REPETITION_PENALTY,
+    top_p: float = TOP_P,
+    top_k: float = TOP_K,
+    max_new_tokens: int = MAX_NEW_TOKENS,
+) -> Iterator[str]:
+    """Generate function for chat demo."""
+    # Build messages
+    conversation = []
+    conversation.append({"role": "system", "content": SYS_PROMPT})
+    conversation += chat_history
+    conversation.append({"role": "user", "content": message})
+
+    # Convert messages to prompt format
+    input_ids = tokenizer.apply_chat_template(
+        conversation,
+        return_tensors="pt",
+        add_generation_prompt=True,
+        truncation=True,
+        max_length=MAX_INPUT_TOKEN_LENGTH - max_new_tokens,
+    )
+
+    input_ids = input_ids.to(model.device)
+    streamer = TextIteratorStreamer(tokenizer, skip_prompt=True, skip_special_tokens=True)
+    generate_kwargs = dict(
+        {"input_ids": input_ids},
+        attention_mask=torch.ones_like(input_ids),
+        streamer=streamer,
+        max_new_tokens=max_new_tokens,
+        do_sample=True,
+        top_p=top_p,
+        top_k=top_k,
+        temperature=temperature,
+        num_beams=1,
+        repetition_penalty=repetition_penalty,
+    )
+
+    t = Thread(target=model.generate, kwargs=generate_kwargs)
+    t.start()
+
+    outputs = []
+    for text in streamer:
+        outputs.append(text)
+        yield "".join(outputs)
+
+
+css_file_path = Path(Path(__file__).parent / "app.css")
+head_file_path = Path(Path(__file__).parent / "app_head.html")
+
+# advanced settings (displayed in Accordion)
+temperature_slider = gr.Slider(
+    minimum=0, maximum=1.0, value=TEMPERATURE, step=0.1, label="Temperature", elem_classes=["gr_accordion_element"]
+)
+top_p_slider = gr.Slider(
+    minimum=0, maximum=1.0, value=TOP_P, step=0.05, label="Top P", elem_classes=["gr_accordion_element"]
+)
+top_k_slider = gr.Slider(
+    minimum=0, maximum=100, value=TOP_K, step=1, label="Top K", elem_classes=["gr_accordion_element"]
+)
+repetition_penalty_slider = gr.Slider(
+    minimum=0,
+    maximum=2.0,
+    value=REPETITION_PENALTY,
+    step=0.05,
+    label="Repetition Penalty",
+    elem_classes=["gr_accordion_element"],
+)
+max_new_tokens_slider = gr.Slider(
+    minimum=1,
+    maximum=2000,
+    value=MAX_NEW_TOKENS,
+    step=1,
+    label="Max New Tokens",
+    elem_classes=["gr_accordion_element"],
+)
+chat_interface_accordion = gr.Accordion(label="Advanced Settings", open=False)
+
+with gr.Blocks(fill_height=True, css_paths=css_file_path, head_paths=head_file_path, theme=theme, title=TITLE) as demo:
+    gr.HTML(f"<h1>{TITLE}</h1>", elem_classes=["gr_title"])
+    gr.HTML(DESCRIPTION)
+    chat_interface = gr.ChatInterface(
+        fn=generate,
+        examples=[
+            ["Explain the concept of quantum computing to someone with no background in physics or computer science."],
+            ["What is OpenShift?"],
+            ["What's the importance of low latency inference?"],
+            ["Help me boost productivity habits."],
+            [
+                """Explain the following code in a concise manner:
+
+```java
+import java.util.ArrayList;
+import java.util.List;
+
+public class Main {
+
+    public static void main(String[] args) {
+        int[] arr = {1, 5, 3, 4, 2};
+        int diff = 3;
+        List<Pair> pairs = findPairs(arr, diff);
+        for (Pair pair : pairs) {
+            System.out.println(pair.x + " " + pair.y);
+        }
+    }
+
+    public static List<Pair> findPairs(int[] arr, int diff) {
+        List<Pair> pairs = new ArrayList<>();
+        for (int i = 0; i < arr.length; i++) {
+            for (int j = i + 1; j < arr.length; j++) {
+                if (Math.abs(arr[i] - arr[j]) < diff) {
+                    pairs.add(new Pair(arr[i], arr[j]));
+                }
+            }
+        }
+
+        return pairs;
+    }
+}
+
+class Pair {
+    int x;
+    int y;
+    public Pair(int x, int y) {
+        this.x = x;
+        this.y = y;
+    }
+}
+```"""
+            ],
+            [
+                """Generate a Java code block from the following explanation:
+
+The code in the Main class finds all pairs in an array whose absolute difference is less than a given value.
+
+The findPairs method takes two arguments: an array of integers and a difference value. It iterates over the array and compares each element to every other element in the array. If the absolute difference between the two elements is less than the difference value, a new Pair object is created and added to a list.
+
+The Pair class is a simple data structure that stores two integers.
+
+The main method creates an array of integers, initializes the difference value, and calls the findPairs method to find all pairs in the array. Finally, the code iterates over the list of pairs and prints each pair to the console."""  # noqa: E501
+            ],
+        ],
+        example_labels=[
+            "Explain quantum computing",
+            "What is OpenShift?",
+            "Importance of low latency inference",
+            "Boosting productivity habits",
+            "Explain and document your code",
+            "Generate Java Code",
+        ],
+        cache_examples=False,
+        type="messages",
+        additional_inputs=[
+            temperature_slider,
+            repetition_penalty_slider,
+            top_p_slider,
+            top_k_slider,
+            max_new_tokens_slider,
+        ],
+        additional_inputs_accordion=chat_interface_accordion,
+    )
+
+if __name__ == "__main__":
+    demo.queue().launch()

src/app_head.html

@@ -0,0 +1,16 @@
+<link
+  rel="stylesheet"
+  href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
+/>
+<script
+  async
+  src="https://www.googletagmanager.com/gtag/js?id=G-C6LFT227RC"
+></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag() {
+    dataLayer.push(arguments);
+  }
+  gtag("js", new Date());
+  gtag("config", "G-C6LFT227RC");
+</script>

src/themes/carbon.py

@@ -0,0 +1,147 @@
+"""IBM Carbon theme for gradio demos.
+
+This version builds on top of the Carbon theme to make it more playful with rounded corners, a larger font family to
+enhance readability, and the IBM Cool Gray color palette for better consistency with other IBM Research demos, such as
+Bee.
+"""
+
+import gradio as gr
+from gradio.themes.utils import sizes
+
+theme = gr.themes.Base(
+    primary_hue=gr.themes.Color(
+        c100="#EDF5FF",
+        c200="#D0E2FF",
+        c300="#A6C8FF",
+        c400="#78A9FF",
+        c50="#F9F9FB",
+        c500="#4589FF",
+        c600="#0F62FE",
+        c700="#0043CE",
+        c800="#002D9C",
+        c900="#001D6C",
+        c950="#001141",
+    ),
+    secondary_hue=gr.themes.Color(
+        c100="#EDF5FF",
+        c200="#D0E2FF",
+        c300="#A6C8FF",
+        c400="#78A9FF",
+        c50="#F9F9FB",
+        c500="#4589FF",
+        c600="#0F62FE",
+        c700="#0043CE",
+        c800="#002D9C",
+        c900="#001D6C",
+        c950="#001141",
+    ),
+    neutral_hue=gr.themes.Color(
+        c100="#F2F4F8",
+        c200="#DDE1E6",
+        c300="#C1C7CD",
+        c400="#A2A9B0",
+        c50="#F9F9FB",
+        c500="#878D96",
+        c600="#697077",
+        c700="#4D5358",
+        c800="#393939",
+        c900="#21272A",
+        c950="#121619",
+    ),
+    spacing_size=sizes.spacing_md,  # change spacing to default size
+    radius_size=sizes.radius_md,  # change spacing to default size and Keep Radius to make demo feel more playful
+    text_size=sizes.text_lg,  # change fontsize to default size
+    #   spacing_size: sizes.Size | str = sizes.spacing_md,  #change spacing to default size
+    #         radius_size: sizes.Size | str = sizes.radius_md, #change spacing to default size and Keep Radius to make
+    #                                                           demo feel more playful
+    #         text_size: sizes.Size | str = sizes.text_lg, #change fontsize to default size
+    font=["IBM Plex Sans", "ui-sans-serif", "system-ui", "sans-serif"],  # update font
+    font_mono=["IBM Plex Mono", "ui-monospace", "Consolas", "monospace"],  # update font
+).set(
+    # Colors
+    background_fill_primary="*neutral_100",  # Coolgray10 background
+    background_fill_primary_dark="*neutral_950",  # Coolgray95 background for dark mode
+    slider_color="*primary_600",  # Blue60
+    slider_color_dark="*primary_500",  # Blue50
+    # Shadows
+    shadow_drop="0 1px 4px 0 rgb(0 0 0 / 0.1)",
+    shadow_drop_lg="0 2px 5px 0 rgb(0 0 0 / 0.1)",
+    # Block Labels
+    block_background_fill="white",
+    block_label_background_fill="white",  # same color as blockback gound fill
+    block_label_radius="*radius_md",
+    block_label_text_size="*text_md",
+    block_label_text_weight="600",
+    block_label_text_color="black",
+    block_label_text_color_dark="white",
+    block_title_radius="*block_label_radius",
+    block_title_background_fill="*block_label_background_fill",
+    block_title_text_weight="600",
+    block_title_text_color="black",
+    block_title_text_color_dark="white",
+    block_label_margin="*spacing_md",
+    # Inputs
+    input_background_fill="white",
+    input_background_fill_dark="*block-background-fill",
+    input_border_color="*neutral_100",
+    input_shadow="*shadow_drop",
+    input_shadow_focus="*shadow_drop_lg",
+    checkbox_shadow="none",
+    # Buttons
+    shadow_spread="6px",
+    button_primary_shadow="*shadow_drop_lg",
+    button_primary_shadow_hover="*shadow_drop_lg",
+    button_primary_shadow_active="*shadow_inset",
+    button_secondary_shadow="*shadow_drop_lg",
+    button_secondary_shadow_hover="*shadow_drop_lg",
+    button_secondary_shadow_active="*shadow_inset",
+    checkbox_label_shadow="*shadow_drop_lg",
+    button_primary_background_fill="*primary_600",
+    button_primary_background_fill_hover="*primary_500",
+    button_primary_background_fill_hover_dark="*primary_500",
+    button_primary_text_color="white",
+    button_secondary_background_fill="white",
+    button_secondary_background_fill_hover="*neutral_100",
+    button_secondary_background_fill_dark="*neutral_800",  # Secondary cool gray 80
+    button_secondary_background_fill_hover_dark="*primary_500",
+    button_secondary_text_color="*neutral_800",
+    button_cancel_background_fill="*button_secondary_background_fill",
+    button_cancel_background_fill_hover="*button_secondary_background_fill_hover",
+    button_cancel_background_fill_hover_dark="*button_secondary_background_fill_hover",
+    button_cancel_text_color="*button_secondary_text_color",
+    checkbox_label_background_fill_selected="*primary_200",
+    checkbox_label_background_fill_selected_dark="*primary_500",
+    checkbox_border_width="1px",
+    checkbox_border_color="*neutral_200",
+    checkbox_background_color_dark="*neutral_700",  # Jan 18 test to fix checkbox, radio button background color
+    checkbox_background_color_selected="*primary_600",
+    checkbox_background_color_selected_dark="*primary_500",
+    checkbox_border_color_focus="*primary_600",
+    checkbox_border_color_focus_dark="*primary_500",
+    checkbox_border_color_selected="*primary_600",
+    checkbox_border_color_selected_dark="*primary_500",
+    checkbox_label_text_color_selected="black",
+    # Borders
+    block_border_width="1px",  # test example border
+    panel_border_width="1px",
+    # Chatbubble related colors
+    # light
+    # color_accent = "*secondary_400",
+    border_color_accent_subdued="*color_accent_soft",  # chatbubble human border color, use Blue 20 as an accent color
+    color_accent_soft="*secondary_200",  # chatbubble human color
+    # darkmode
+    # chatbubble human border color in darkmode, use Blue 20 as an accent color
+    border_color_accent_subdued_dark="*secondary_500",
+    color_accent_soft_dark="*secondary_500",  # chatbubble human color in dark mode
+    # Chatbot related font
+    chatbot_text_size="*text_md",  # make it larger
+    # additional dark mode related tweaks:
+    # block_background_fill_dark="*neutral_950", # Jan 18 test coolgray95 background for dark mode
+    block_label_background_fill_dark="*neutral_800",  # same color as blockback gound fill
+    block_title_background_fill_dark="*block_label_background_fill",
+    # input_background_fill_dark="*neutral_800", #This attribute help match fill color cool gray 80 to match background
+    #                                             however cause the problem for the general theme.
+    #  input_shadow_dark="*shadow_drop", #Test if it could make the border without the color
+    # input_border_color_dark="*neutral_200",#add attribute for border Jan 18
+    checkbox_border_color_dark="*neutral_600",  # Jan 18 test to fix border
+)

src/themes/research_monochrome.py

@@ -0,0 +1,152 @@
+"""IBM Research Monochrome theme for gradio demos.
+
+This version is a variation of CarbonSoft style, where the primary button is dark gray to create monochrome style. This
+version uses the style from Research demos such as Bee to make it more playful with rounded corners, a larger font
+family to enhance readability, and the IBM Cool Gray color palette for better consistency with other IBM Research demos,
+such as Bee.
+"""
+
+import gradio as gr
+from gradio.themes.utils import sizes
+
+theme = gr.themes.Base(
+    primary_hue=gr.themes.Color(
+        c100="#EDF5FF",
+        c200="#D0E2FF",
+        c300="#A6C8FF",
+        c400="#78A9FF",
+        c50="#F9F9FB",
+        c500="#4589FF",
+        c600="#0F62FE",
+        c700="#0043CE",
+        c800="#002D9C",
+        c900="#001D6C",
+        c950="#001141",
+    ),
+    secondary_hue=gr.themes.Color(
+        c100="#EDF5FF",
+        c200="#D0E2FF",
+        c300="#A6C8FF",
+        c400="#78A9FF",
+        c50="#F9F9FB",
+        c500="#4589FF",
+        c600="#0F62FE",
+        c700="#0043CE",
+        c800="#002D9C",
+        c900="#001D6C",
+        c950="#001141",
+    ),
+    neutral_hue=gr.themes.Color(
+        c100="#F2F4F8",
+        c200="#DDE1E6",
+        c300="#C1C7CD",
+        c400="#A2A9B0",
+        c50="#F9F9FB",
+        c500="#878D96",
+        c600="#697077",
+        c700="#4D5358",
+        c800="#393939",
+        c900="#21272A",
+        c950="#121619",
+    ),
+    spacing_size=sizes.spacing_md,  # change spacing to default size
+    radius_size=sizes.radius_md,  # change spacing to default size and Keep Radius to make demo feel more playful
+    text_size=sizes.text_md,  # change fontsize to default size
+    #   spacing_size: sizes.Size | str = sizes.spacing_md,  #change spacing to default size
+    #         radius_size: sizes.Size | str = sizes.radius_md, #change spacing to default size and Keep Radius to make
+    #                                                           demo feel more playful
+    #         text_size: sizes.Size | str = sizes.text_lg, #change fontsize to default size
+    font=["IBM Plex Sans", "ui-sans-serif", "system-ui", "sans-serif"],  # update font
+    font_mono=["IBM Plex Mono", "ui-monospace", "Consolas", "monospace"],  # update font
+).set(
+    # Colors
+    background_fill_primary="*neutral_100",  # Coolgray10 background
+    background_fill_primary_dark="*neutral_950",  # Coolgray95 background for dark mode
+    # Change blue to black to create monochrome style
+    slider_color="*neutral_900",
+    slider_color_dark="*primary_500",
+    # Shadows
+    shadow_drop="0 1px 4px 0 rgb(0 0 0 / 0.1)",
+    shadow_drop_lg="0 2px 5px 0 rgb(0 0 0 / 0.1)",
+    # Block Labels
+    block_background_fill="white",
+    block_label_background_fill="white",  # same color as blockback gound fill
+    block_label_radius="*radius_md",
+    block_label_text_size="*text_md",
+    block_label_text_weight="600",
+    block_label_text_color="black",
+    block_label_text_color_dark="white",
+    block_title_radius="*block_label_radius",
+    block_title_background_fill="*block_label_background_fill",
+    block_title_text_weight="400",
+    block_title_text_color="black",
+    block_title_text_color_dark="white",
+    block_label_margin="*spacing_md",
+    # Inputs
+    input_background_fill="white",
+    input_background_fill_dark="*block-background-fill",
+    input_border_color="*neutral_100",
+    input_shadow="*shadow_drop",
+    input_shadow_dark="0 1px 4px #000",
+    input_shadow_focus="*shadow_drop_lg",
+    checkbox_shadow="none",
+    # Buttons
+    shadow_spread="6px",
+    button_primary_shadow="*shadow_drop_lg",
+    button_primary_shadow_hover="*shadow_drop_lg",
+    button_primary_shadow_active="*shadow_inset",
+    button_secondary_shadow="*shadow_drop_lg",
+    button_secondary_shadow_hover="*shadow_drop_lg",
+    button_secondary_shadow_active="*shadow_inset",
+    checkbox_label_shadow="*shadow_drop_lg",
+    # Change blue to black to create monochrome style
+    button_primary_background_fill="*neutral_900",
+    button_primary_background_fill_dark="*neutral_600",
+    button_primary_background_fill_hover="*neutral_700",
+    button_primary_background_fill_hover_dark="*primary_500",  # hover to be blue
+    button_primary_text_color="white",
+    button_secondary_background_fill="white",
+    button_secondary_background_fill_hover="*neutral_100",
+    button_secondary_background_fill_dark="*neutral_800",  # Secondary cool gray 80
+    button_secondary_background_fill_hover_dark="*primary_500",
+    button_secondary_text_color="*neutral_800",
+    button_cancel_background_fill="*button_secondary_background_fill",
+    button_cancel_background_fill_hover="*button_secondary_background_fill_hover",
+    button_cancel_background_fill_hover_dark="*button_secondary_background_fill_hover",
+    button_cancel_text_color="*button_secondary_text_color",
+    checkbox_label_background_fill_selected="*primary_200",
+    checkbox_label_background_fill_selected_dark="*primary_500",
+    checkbox_border_width="1px",
+    checkbox_border_color="*neutral_200",
+    checkbox_background_color_dark="*neutral_700",  # Jan 18 test to fix checkbox, radio button background color
+    checkbox_background_color_selected="*primary_600",
+    checkbox_background_color_selected_dark="*primary_500",
+    checkbox_border_color_focus="*primary_600",
+    checkbox_border_color_focus_dark="*primary_500",
+    checkbox_border_color_selected="*primary_600",
+    checkbox_border_color_selected_dark="*primary_500",
+    checkbox_label_text_color_selected="black",
+    # Borders
+    block_border_width="1px",  # test example border
+    panel_border_width="1px",
+    # Chatbubble related colors
+    # light
+    # color_accent = "*secondary_400",
+    border_color_accent_subdued="*color_accent_soft",  # chatbubble human border color, use Blue 20 as an accent color
+    color_accent_soft="*secondary_200",  # chatbubble human color
+    # darkmode
+    # chatbubble human border color in darkmode, use Blue 20 as an accent color
+    border_color_accent_subdued_dark="*secondary_500",
+    color_accent_soft_dark="*secondary_500",  # chatbubble human color in dark mode
+    # Chatbot related font
+    chatbot_text_size="*text_md",  # make it larger
+    # additional dark mode related tweaks:
+    # block_background_fill_dark="*neutral_950", # Jan 18 test coolgray95 background for dark mode
+    block_label_background_fill_dark="*neutral_800",  # same color as blockback gound fill
+    block_title_background_fill_dark="*block_label_background_fill",
+    # input_background_fill_dark="*neutral_800", #This attribute help match fill color cool gray 80 to match background
+    #                                             however cause the problem for the general theme.
+    #  input_shadow_dark="*shadow_drop", #Test if it could make the border without the color
+    # input_border_color_dark="*neutral_200",#add attribute for border Jan 18
+    checkbox_border_color_dark="*neutral_600",  # Jan 18 test to fix border
+)