Login via REST API from custom made Login Page

I have implemented Keycloak SSO in my angular web app using keycloak-angular package, but my requirement is to log in via API, not from the keycloak login page, as my login page contains few features other than authentication.

So I have to post the user credentials to the keycloak via REST API call. How can I achieve this?

Read How to create a custom login page using javascript adapter

As per the Keycloak development teams recommendation you should create a custom them.

For example: Serendipity’s Keycloak Theme

Sample Keycloak Dockerfile:

FROM jboss/keycloak:9.0.3

ENV THEME_VERSION 1.0

USER root

RUN microdnf install -y unzip

COPY json /tmp

COPY ./serendipity-keycloak-theme-$THEME_VERSION.zip /opt/jboss/keycloak/themes
RUN cd /opt/jboss/keycloak/themes && \
    unzip serendipity-keycloak-theme-$THEME_VERSION.zip && \
    rm serendipity-keycloak-theme-$THEME_VERSION.zip

keycloak.env

KEYCLOAK_USER=admin
KEYCLOAK_PASSWORD=secret
KEYCLOAK_DEFAULT_THEME=serendipity
KEYCLOAK_IMPORT=/tmp/development-realm.json
KEYCLOAK_MIGRATION_STRATEGY=OVERWRITE_EXISTING