MagicPalette

Use MagicPalette to create custom components that are matches the design of the magic component set. The platte is based on the Catppuccin theme.

The dark variant is based on catppuccin macchiato colors and the light variant on catppuccin latte.

Properties

  • background (out brush): fines the default background brush. Use this if none of the more specialized background brushes apply.
  • foreground (out brush): Defines the foreground brush that is used for content that is displayed on background brush.
  • placeholder_foreground (out brush): Defines the foreground brush that is used for placeholder content.
  • alternate_background (out brush): Defines an alternate background brush that is used for example for text input controls or panels like a side bar.
  • control_background (out brush): Defines the default background brush for controls, such as push buttons, combo boxes, etc.
  • control_foreground (out brush): Defines the foreground brush that is used for content that is displayed on control_background brush.
  • accent_background (in_out brush): Defines the background brush for highlighted controls such as primary buttons.
  • accent_foreground (out brush): Defines the foreground brush that is used for content that is displayed on accent-background brush.
  • destructive_background (out brush): Defines the background brush for destructive controls such as destructive buttons.
  • destructive_foreground (out brush): Defines the foreground brush that is used for content that is displayed on accent-background brush.
  • border (out brush): Defines the brush that is used for borders such as separators and component borders.
  • focus_border (out brush): Defines brush of focus borders.
  • state_pressed (out brush): Defines the brush of the state overlay if the component is pressed.
  • state_hovered (out brush): Defines the brush of the state overlay if the component is hovered by the mouse pointer.
  • selection_background (out brush): Defines the background brush of a text selection.
  • dark_color_scheme (out brush): If color_scheme is set to dark it is true otherwise false.
  • color_scheme (out ColorScheme): Read this property to determine the color scheme used by the palette. Set this property to force a dark or light color scheme.

MagicFontSettings

Use MagicFontSettings to create custom components that matches the font settings of the magic style.

Properties

  • light_font_weight (out int): Defines the light font weight of the magic style.
  • regular_font_weight (out int): Defines the regular font weight of the magic style.
  • semi_bold_font_weight (out int): Defines the semi bold font weight of the magic style.
  • body (out TextStyle): Defines the body text style of magic.
  • body_strong (out TextStyle): Defines body text style with more bold font.
  • header_1 (out TextStyle): Defines a header text style first order.
  • header_2 (out TextStyle): Defines a header text style second order .
  • header_3 (out TextStyle): Defines a header text style third order.

MagicIconSettings

Use MagicIconSettings to create custom components that matches the icon settings of the magic style.

Properties

  • body (out IconStyle): Defines the body icon style of magic.

MagicAnimationSettings

Use MagicAnimationSettings to create animations for custom components that matches the animation settings of the magic style.

Properties

  • color_duration (out duration): Defines the animation duration for color animations.
  • resize_duration (out duration): Defines the animation duration of resizing of an element.

MagicSizeSettings

Use MagicSettingsSettings to define sizes of custom components that matches the settings of the magic style.

Properties

  • box_height (out length): Defines the height of box elements like checkbox.
  • control_height (out length): Defines the default height of controls like buttons.

MagicLayoutSettings

Use MagicLayoutSettings to define padding and spacing of custom components that matches the settings of the magic style.

Properties

  • layout_spacing (out length): Defines the default inner spacing of layouts.
  • control_spacing (out length): Defines the default inner spacing of elements inside of a component.
  • control_padding (out length): Defines the default padding of a component.
  • text_input_padding (out length): Defines the default padding of a text input components.

MagicBorderSettings

Use MagicBorderSettings to define border setting of custom components that matches the magic style.

Properties

  • box_border_radius (out length): Defines the border radius of box elements like checkbox.
  • control_border_radius (out length): Defines the default border radius of elements inside of a component.