Customizing ARC: How to Change Look, Features, and Behavior

ARC is designed to be highly customizable. Whether you want to change the launcher layout, add your own apps, tweak the theme, or remap keys, here’s how to get started!


1. Changing the Layout

The core layout—such as the grid of app icons, tab bar, and top bar—is controlled via the YAML configuration file found in your .config directory (usually ~/.config/arc_launcher.yaml or similar).

To change the app grid:

  • Adjust the grid section:
    grid:
      cols: 4   # number of app columns
      rows: 2   # number of app rows
      margin: 10   # space between cells
      padding: 30  # space around grid
      x_offset: 4
      y_offset: 0
    
      Adjust cell width and height for the size of each app icon.
    

2. Changing Colors and Theme

All UI colors are defined in the colors and accent_color fields. Use RGB lists (e.g., [220, 220, 220] for light gray).

Example:

colors: background: [20, 20, 20] tab_active: [100, 100, 100] button_hover: [100, 160, 210] text: [220, 220, 220] accent_color: [204, 99, 36]

Tip: Use an online color picker to choose your favorite palette.

3. Adding or Removing Apps

The builtin_apps section lets you control which applications appear in your launcher.

To add a new app:

Create or install the app in your apps_dir or somewhere accessible.

Add a new entry to builtin_apps:

- name: Weather
  icon: ./ARC_DE/icons/weather.png
  exec: "python3 -m WeatherApp.main"

Restart the launcher.

To remove an app: Simply delete its entry from the builtin_apps list.

4. Changing Icons

Icons are defined as file paths throughout the config file:

App icons: Set in each app’s icon field.

Status bar icons: Set in the topbar section (battery, wifi, bluetooth, etc.).

Other icons: WiFi locked/unlocked, notifications, etc.

Replace icon files in ./ARC_DE/icons/ or reference your own files.

5. Changing Fonts

You can use your favorite font by updating the font section:

font: name: ./assets/fonts/Inter/Inter_18pt-SemiBold.ttf size: 20

Change the name to your font file path and adjust size as you prefer.

6. Editing Music and Game Directories

music_dir: Default music folder (e.g., ~/Music)

game_json: Path to your games JSON file (e.g., ~/Games/games.json)

7. Adjusting Corner Radius and UI Elements

radius: Controls the roundness of buttons, app icons, sliders, etc.

indicator: Controls the appearance and spacing of indicator dots (such as for page navigation or volume).

8. Changing Warning Duration

warning_duration: How long (in milliseconds) a warning message will display.
Example: warning_duration: 2000 (2 seconds)

9. Saving and Applying Changes

After editing your configuration:

Save the YAML file.

Restart the ARC launcher or reboot the system to apply the changes.

10. Advanced: Adding Custom Apps or Packages

apps_dir: Directory for additional user apps.

packages_dir: Directory for extra software packages.

Place your custom scripts or apps in these folders and reference them in builtin_apps as shown above.

11. Troubleshooting

Launcher doesn't start?

Double-check your YAML syntax. Use an online YAML validator if unsure.

App not showing up?

Make sure the exec command is correct and the script or app is executable, and delete the "launcher_apps.json" from .cache.

Example config file:

screen:
 width: 480
 height: 320
 fps: 30

tab:
 width: 100
 height: 40
 margin: 5

accent_color: [204, 99, 36]

colors:
 background: [20, 20, 20]
 background_light: [250, 250, 250]
 tab_bg: [50, 50, 50]
 tab_active: [100, 100, 100]
 button: [220, 220, 220]
 button_hover: [100, 160, 210]
 text_light: [5, 5, 5]
 text: [220, 220, 220]
 warning_bg: [200, 50, 50]
 warning_text: [255, 255, 255]
 indicator: [180, 180, 180]
 indicator_active: [255, 255, 255]
 input_bg: [255, 255, 255]
 input_border: [100, 100, 100]
 input_text: [0, 0, 0]
 input_placeholder: [150, 150, 150]
 cell_bg: [220, 220, 220]
 cell_active: [240, 240, 240]
 accent: [204, 99, 36]
 slider_bg: [80, 80, 80]
 slider_fill: [50, 150, 250]
 slider_knob: [200, 200, 200]
 slider_active_knob: [255, 255, 255]

icons:
 wifi_locked: ./ARC_DE/icons/wifi_locked.png
 wifi_unlocked: ./ARC_DE/icons/wifi_unlocked.png

builtin_apps:
 - name: Terminal
   icon: ./ARC_DE/icons/terminal.png
   exec: "kitty --directory=~"
 - name: Web browser
   icon: ./ARC_DE/icons/browser.png
   exec: "python3 ./web_apps/browser.py"
 - name: Calendar
   icon: ./ARC_DE/icons/calendar.png
   exec: "python3 -m Calendar_app.main"
 - name: RF tools
   icon: ./ARC_DE/icons/rf.png
   exec: "python3 -m RF_tools.main"
 - name: IR tools
   icon: ./ARC_DE/icons/ir.png
   exec: "python3 -m IR_tools.main"
 - name: NFC tools
   icon: ./ARC_DE/icons/nfc.png
   exec: "python3 -m NFC_tools.main"
 - name: WiFi tools
   icon: ./ARC_DE/icons/wifi_tools.png
   exec: "python3 -m WIFI_tools.main"
 - name: Bluetooth tools
   icon: ./ARC_DE/icons/bluetooth_tools.png
   exec: "python3 -m BT_tools.main"
 - name: Files
   icon: ./ARC_DE/icons/files.png
   exec: "pcmanfm"
 - name: Text editor
   icon: ./ARC_DE/icons/editor.png
   exec: "python3 -m Notes_app.main"
 - name: Music
   icon: ./ARC_DE/icons/music.png
   exec: "python3 -m music_player.main"
 - name: Games
   icon: ./ARC_DE/icons/games.png
   exec: "python3 -m Games.main"
 - name: Settings
   icon: ./ARC_DE/icons/settings.png
   exec: "python -m Settings.main"
 - name: ARC connect
   icon: ./ARC_DE/icons/arc_connect.png
   exec: "python3 -m ARC_connect.ip"

apps_dir: ./apps
packages_dir: ./packages

grid:
 cols: 4
 rows: 2
 margin: 10
 padding: 30
 x_offset: 4
 y_offset: 0

cell:
 width: 90  # (you may want to compute this in Python based on grid, etc.)
 height: 90

topbar:
 height: 30
 bg: [20, 20, 20]
 fg: [200, 200, 200]
 notification_dot: [245, 88, 88]
 icons: []
 icon_battery: ./ARC_DE/icons/topbar/battery.png
 icon_mobile: ./ARC_DE/icons/topbar/cellular.png
 wifi_icons:
   - ./ARC_DE/icons/topbar/wifi_0.png
   - ./ARC_DE/icons/topbar/wifi_1.png
   - ./ARC_DE/icons/topbar/wifi_2.png
   - ./ARC_DE/icons/topbar/wifi_3.png
   - ./ARC_DE/icons/topbar/wifi_4.png
 icon_bt_on: ./ARC_DE/icons/topbar/bluetooth_on.png
 icon_bt_off: ./ARC_DE/icons/topbar/bluetooth_off.png
 icon_bt_connected: ./ARC_DE/icons/topbar/bluetooth_connected.png
 show_clock: true
 clock_format: "%H:%M"
 show_notifications: true
 show_battery: true
 show_wifi: true
 show_bt: true
 show_mobile: true
 padding_left: 5
 padding_right: 5
 icon_spacing: 5
 notification_spacing: 5

radius:
 button: 8
 app_button: 20
 tab: 6
 warning: 6
 modal: 6
 input: 6
 app_icon: 15
 slider: 4
 slider_knob: 6

indicator:
 radius: 4
 spacing: 10

font:
 name: ./assets/fonts/Inter/Inter_18pt-SemiBold.ttf
 size: 20

music_dir: ~/Music
game_json: ~/Games/games.json

warning_duration: 2000