Wish card like this can be implemented

[rememberber]

[gk-brown]

I mocked this up very quickly using Sierra. It's not complete and I did not attempt to replicate your styling. However, the layout itself is not difficult:

<?xml version="1.0" encoding="utf-8"?>

<!DOCTYPE column-panel SYSTEM "sierra.dtd">

<column-panel spacing="16" padding="32" opaque="true" background="white">
    <label text="Appearance" font="h1.font"/>

    <row-panel padding="8" opaque="true" background="#eeeeee" border="silver">
        <column-panel weight="1">
            <label text="Theme" font="h3.font"/>
            <label text="Choose between light, dark, or high-contrast themes" font="medium.font"/>
        </column-panel>

        <column-panel>
            <spacer weight="1"/>
            <combo-box/>
            <spacer weight="1"/>
        </column-panel>
    </row-panel>

    <column-panel spacing="4">
        <label text="Chat" font="h2.font"/>

        <row-panel padding="8" opaque="true" background="#eeeeee" border="silver">
            <column-panel weight="1">
                <label text="Tool Call Density" font="h3.font"/>
                <label text="Adjust how much detail is shown for tool calls" font="medium.font"/>
            </column-panel>

            <column-panel>
                <spacer weight="1"/>
                <slider/>
                <row-panel>
                    <label text="Compact"/>
                    <spacer weight="1"/>
                    <label text="Detailed"/>
                </row-panel>
                <spacer weight="1"/>
            </column-panel>
        </row-panel>
    </column-panel>

    <column-panel spacing="4">
        <label text="Colors" font="h2.font"/>

        <row-panel padding="8" opaque="true" background="#eeeeee" border="silver">
            <column-panel weight="1">
                <label text="Hue" font="h3.font"/>
                <label text="Choose a tint color" font="medium.font"/>
            </column-panel>

            <column-panel>
                <spacer weight="1"/>
                <slider/>
                <spacer weight="1"/>
            </column-panel>
        </row-panel>

        <row-panel padding="8" opaque="true" background="#eeeeee" border="silver">
            <column-panel weight="1">
                <label text="Intensity" font="h3.font"/>
                <label text="Control how strongly the tint is applied" font="medium.font"/>
            </column-panel>

            <column-panel>
                <spacer weight="1"/>
                <slider/>
                <spacer weight="1"/>
            </column-panel>
        </row-panel>

        <row-panel padding="8" opaque="true" background="#eeeeee" border="silver">
            <column-panel weight="1">
                <label text="Reduce Transparency" font="h3.font"/>
                <label text="Replace translucent surfaces with opaque backgrounds" font="medium.font"/>
            </column-panel>

            <column-panel>
                <spacer weight="1"/>
                <check-box/>
                <spacer weight="1"/>
            </column-panel>
        </row-panel>
    </column-panel>
</column-panel>

[gk-brown]

Here is a slightly simpler version that takes better advantage of FlatLaf styling:

<?xml version="1.0" encoding="utf-8"?>

<!DOCTYPE tabbed-pane SYSTEM "sierra.dtd">

<tabbed-pane>
    <column-panel tabTitle="Appearance" spacing="16" padding="16">
        <column-panel border="Component.borderColor" padding="8" spacing="8">
            <row-panel>
                <column-panel weight="1">
                    <label text="Theme"/>
                    <label text="Choose between light, dark, or high-contrast themes" font="medium.font"/>
                </column-panel>

                <column-panel>
                    <spacer weight="1"/>
                    <combo-box/>
                    <spacer weight="1"/>
                </column-panel>
            </row-panel>
        </column-panel>

        <column-panel title="Chat" padding="8" spacing="8">
            <row-panel>
                <column-panel weight="1">
                    <label text="Tool Call Density"/>
                    <label text="Adjust how much detail is shown for tool calls" font="medium.font"/>
                </column-panel>

                <column-panel>
                    <spacer weight="1"/>
                    <slider/>
                    <row-panel>
                        <label text="Compact"/>
                        <spacer weight="1"/>
                        <label text="Detailed"/>
                    </row-panel>
                    <spacer weight="1"/>
                </column-panel>
            </row-panel>
        </column-panel>

        <column-panel title="Colors" padding="8" spacing="8">
            <row-panel>
                <column-panel weight="1">
                    <label text="Hue"/>
                    <label text="Choose a tint color" font="medium.font"/>
                </column-panel>

                <column-panel>
                    <spacer weight="1"/>
                    <slider/>
                    <spacer weight="1"/>
                </column-panel>
            </row-panel>

            <separator/>

            <row-panel>
                <column-panel weight="1">
                    <label text="Intensity"/>
                    <label text="Control how strongly the tint is applied" font="medium.font"/>
                </column-panel>

                <column-panel>
                    <spacer weight="1"/>
                    <slider/>
                    <spacer weight="1"/>
                </column-panel>
            </row-panel>

            <separator/>

            <row-panel>
                <column-panel weight="1">
                    <label text="Reduce Transparency"/>
                    <label text="Replace translucent surfaces with opaque backgrounds" font="medium.font"/>
                </column-panel>

                <column-panel>
                    <spacer weight="1"/>
                    <check-box/>
                    <spacer weight="1"/>
                </column-panel>
            </row-panel>
        </column-panel>
    </column-panel>
</tabbed-pane>