Skip to content
- Primary Button Gradient
- Defines the gradient background color for primary buttons on the platform.
- Purpose: Allows customization of the button appearance using gradient colors.
- Default Value:
linear-gradient(180deg, #8f82ff 0%, #4638f1 100%)
- Example:- A gradient transition from #8f82ff to #4638f1.
- Outline Button Border Gradient
- Specifies the gradient color for the border of outline buttons.
- Purpose: Customizes the visual style of button borders.
- Default Value:
linear-gradient(180deg, #8f82ff 0%, #4638f1 100%)
- Primary Button Text Color
- Sets the text color for primary buttons.
- Purpose: Ensures the button text is readable against the button background.
- Default Value:
#ffffff (white)
- Outline Button Text Color
- Determines the text color for outline buttons.
- Purpose: Matches the text color with the theme for consistency.
- Default Value:
#ffffff (white)
- Footer Background Color
- Specifies the background color for the footer section of the platform.
- Purpose: Allows branding and aesthetic customization of the footer.
- Default Value:
#0b0b0b (dark black)
- Footer Text Color
- Sets the text color for content within the footer.
- Purpose: Ensures the text contrasts well with the footer background.
- Default Value:
#a7a7a7 (light gray)
- Body Background Color
- Defines the overall background color for the body of the platform.
- Purpose: Sets the tone and style of the platform’s primary area.
- Default Value:
#050505 (dark black)
- Card Background Color
- Specifies the background color for cards displayed on the platform.
- Purpose: Customizes the appearance of card elements.
- Default Value:
#161617 (dark gray)
- Card Secondary Background Color
- Sets the secondary background color for cards.
- Purpose: Adds design flexibility for multi-layered or highlighted card elements.
- Default Value:
#1f1f1f (slightly lighter gray)
- Body Text Primary Color
- Defines the primary color for text in the main body.
- Purpose: Ensures readability and consistent styling of the text.
- Default Value:
#8d8d8d (light gray)
- Body Text Secondary Color
- Sets the secondary text color for the body of the application.
- Purpose: Used for secondary information or less emphasized text.
- Default Value:
#ffffff (white)
- Border Gradient
- Specifies the gradient color for element borders.
- Purpose: Enhances the visual appeal of borders with gradient effects.
- Default Value:
linear-gradient(0deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1))
- Example: A gradient that fades at 0 degrees using semi-transparent white.
- Border Hover Gradient
- Defines the gradient color for borders when the element is hovered over.
- Purpose: Provides a hover effect for better user interactivity.
- Default Value:
linear-gradient(89.54deg, #d5478e 0.29%, #7008d2 49.92%, #437ddb 99.54%)
- Example: A multi-color transition gradient from pink to purple to blue.
- Section Title Gradient
- Specifies the gradient color for section titles.
- Purpose: Adds a visually distinct style for section headers.
- Default Value:
linear-gradient(172.07deg, #ffffff 29.49%, #999999 75.15%)
- Example: A gradient from white to gray.
- Primary Gradient
- Defines the primary gradient color for major UI elements.
- Purpose: Sets a consistent color theme for primary elements like buttons.
- Default Value:
linear-gradient(180deg, #8f82ff 0%, #4638f1 100%)
- Example: A gradient from light purple to dark purple.
- Secondary Gradient
- Specifies the gradient color for secondary UI elements.
- Purpose: Provides an alternate color theme for less emphasized elements.
- Default Value:
linear-gradient(270deg, rgba(255, 255, 255, 0.2) 0.04%, rgba(255, 255, 255, 0.14) 100%)
- Example: A subtle white gradient with transparency.
- Input Background
- Sets the background color for input fields.
- Purpose: Ensures input fields visually stand out and are easily identifiable.
- Default Value:
linear-gradient(270deg, rgba(255, 255, 255, 0.2) 0.04%, rgba(255, 255, 255, 0.14) 100%)
- Example: A gradient that fades subtly for input boxes.
- Input Background (Color)
- Defines a flat background color for input fields.
- Purpose: Provides a simple and clean look for input fields.
- Default Value:
#8e81ff (a light purple shade)
- Offer Card Style
- Determines the size and look of offer cards across the application.
- Options:- There are two options under it
- Large:- Displays offer cards in a bigger size.
- Small:- Displays offer cards in a smaller size.
- Purpose: Customizes how offers are visually presented.
- Cashout Card Style
- Configures the visual style for cashout cards.
- Options:- There are two options under it
- With Card Image: Displays the cashout card with an image for added visual appeal
- With Logo:- Displays the cashout card with a logo
- Purpose: Tailors the look and feel of the cashout section.
