diff --git a/dashboard/src/App.svelte b/dashboard/src/App.svelte
index bca3a6ae..ac324263 100644
--- a/dashboard/src/App.svelte
+++ b/dashboard/src/App.svelte
@@ -15,6 +15,7 @@ import DiscordLogin from "./pages/DiscordLogin.svelte";
   import { onMount } from 'svelte';
 import BulkGroupPrivacy from "./pages/BulkGroupPrivacy.svelte";
 import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
+  import Random from './pages/Random.svelte';
   
   // theme cdns (I might make some myself too)
   // if there's a style already set, retrieve it
@@ -38,8 +39,6 @@ import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
     };
   };
 
-  let falseBool = false;
-
   onMount(() => {
     let settings = JSON.parse(localStorage.getItem("pk-settings"));
 
@@ -55,21 +54,29 @@ import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
     <Route path="/"><Home /></Route>
     <Route path="/login/discord"><DiscordLogin /></Route>
     <Route path="dash"><Dash /></Route>
-    <Route path="dash/m/:id"><Member isPublic={falseBool}/></Route>
-    <Route path = "dash/g/:id"><Group isPublic={falseBool}/></Route>
+    <Route path="dash/m/:id"><Member isPublic={false}/></Route>
+    <Route path = "dash/g/:id"><Group isPublic={false}/></Route>
+    <Route path="dash/random"><Random isPublic={false} type={"member"}/></Route>
+    <Route path="dash/random/m"><Random isPublic={false} type={"member"}/></Route>
+    <Route path="dash/random/g"><Random isPublic={false} type={"group"}/></Route>
+    <Route path="dash/g/:groupId/random"><Random isPublic={false} type={"member"} pickFromGroup={true}/></Route>
     <Route path="dash/bulk-member-privacy"><BulkMemberPrivacy/></Route>
     <Route path="dash/bulk-group-privacy"><BulkGroupPrivacy/></Route>
     <Route path="settings"><Settings /></Route>
     <Route path="profile"><Public /></Route>
     <Route path = "profile/s/:id"><Main /></Route>
-    <Route path = "s">
+    <Route path = "profile/s">
       <Alert color="danger">Please provide a system ID in the URL.</Alert>
     </Route>
+    <Route path="profile/s/:id/random"><Random isPublic={true} type={"member"}/></Route>
+    <Route path="profile/s/:id/random/m"><Random isPublic={true} type={"member"}/></Route>
+    <Route path="profile/s/:id/random/g"><Random isPublic={true} type={"group"}/></Route>
     <Route path = "profile/m/:id"><Member/></Route>
     <Route path = "profile/m">
       <Alert color="danger">Please provide a member ID in the URL.</Alert>
     </Route>
     <Route path = "profile/g/:id"><Group/></Route>
+    <Route path="profile/g/:groupId/random"><Random isPublic={true} type={"member"} pickFromGroup={true}/></Route>
     <Route path = "profile/g">
       <Alert color="danger">Please provide a group ID in the URL.</Alert>
     </Route>
diff --git a/dashboard/src/lib/group/Body.svelte b/dashboard/src/lib/group/Body.svelte
index eb78b24b..6d280180 100644
--- a/dashboard/src/lib/group/Body.svelte
+++ b/dashboard/src/lib/group/Body.svelte
@@ -104,25 +104,50 @@
     </Col>
     {/if}
 </Row>
-<div class="my-2 description" bind:this={descriptionElement}>
+<div class="mt-2 mb-3 description" bind:this={descriptionElement}>
     <b>Description:</b><br />
     {@html htmlDescription && htmlDescription}
 </div>
 {#if (group.banner && ((settings && settings.appearance.banner_bottom) || !settings))}
 <img src={group.banner} alt="group banner" class="w-100 mb-3 rounded" style="max-height: 12em; object-fit: cover"/>
 {/if}
+
 {#if !isPublic}
-<Button style="flex: 0" color="primary" on:click={() => editMode = true} aria-label="edit group information">Edit</Button> 
-{#if isMainDash}<Button style="flex: 0" color="secondary" on:click={() => memberMode = true} aria-label="edit group members">Members</Button>{/if}
-{/if}
-{#if !isPage}
-    <Link to={isPublic ? `/profile/g/${group.id}` : `/dash/g/${group.id}`}><Button style="flex: 0; {!isPublic && "float: right;"}" color="primary" tabindex={-1} aria-label="view group page">View page</Button></Link>
-    {:else if !isPublic}
-    <Link to="/dash?tab=groups"><Button style="flex: 0; {!isPublic && "float: right;"}" color="primary" tabindex={-1} aria-label="view group system">View system</Button></Link>
+<Button style="flex: 0" class="link-button" color="primary" on:click={() => editMode = true} aria-label="edit group information">Edit</Button> 
+    {#if isMainDash}
+    <Button class="link-button" style="flex: 0" color="secondary" on:click={() => memberMode = true} aria-label="edit group members">Members</Button>
     {/if}
+{/if}
+
+{#if !isPage}
+    <Link to={isPublic ? `/profile/g/${group.id}` : `/dash/g/${group.id}`}><button class="link-button button-right btn btn-primary" tabindex={-1} aria-label="view group page">View page</button></Link>
+    {:else if !isPublic}
+    <Link to="/dash?tab=groups"><button class="link-button button-right btn btn-primary" tabindex={-1} aria-label="view group system">View system</button></Link>
+{/if}
+<Link to={isPublic ? `/profile/g/${group.id}/random` : `/dash/g/${group.id}/random`}><button class="link-button button-right btn btn-secondary" style={isPublic ? "float: none !important; margin-left: 0;" : ""} tabindex={-1} aria-label="randomize group members">Randomize group</button></Link>
+
 {:else if editMode}
 <Edit on:deletion bind:group bind:editMode />
 {:else if memberMode}
     <MemberEdit bind:group bind:memberMode bind:members />
 {/if}
-</CardBody>
\ No newline at end of file
+</CardBody>
+
+<style>
+    .link-button {
+        width: 100%;
+        margin-bottom: 0.2em;
+    }
+
+    @media (min-width: 992px) {
+        .link-button {
+            width: max-content;
+            margin-bottom: 0;
+        }
+
+        .button-right {
+            float: right;
+            margin-left: 0.25em;
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/dashboard/src/lib/list/ListControl.svelte b/dashboard/src/lib/list/ListControl.svelte
index 008d5500..cb080f7d 100644
--- a/dashboard/src/lib/list/ListControl.svelte
+++ b/dashboard/src/lib/list/ListControl.svelte
@@ -3,6 +3,7 @@ import { Card, CardHeader, CardBody, CardTitle, Alert, Accordion, AccordionItem,
 import FaSearch from 'svelte-icons/fa/FaSearch.svelte'
 import Svelecte, { addFormatter } from 'svelecte';
 import { Member, Group } from '../../api/types';
+import { Link, useParams } from 'svelte-navigator';
 
 export let list: Member[] | Group[] = [];
 
@@ -24,6 +25,9 @@ let selectedGroups = [];
 export let currentPage: number;
 export let isPublic: boolean;
 
+let params = useParams();
+$: systemId = $params.id;
+
 $: {searchValue; privacyFilter; currentPage = 1};
 
 // converting list to any[] avoids a "this expression is not calleable" error
@@ -143,6 +147,19 @@ function memberListRenderer(item: any) {
 addFormatter({
     'member-list': memberListRenderer
 });
+
+function getRandomizerUrl(): string {
+    let str: string;
+    if (isPublic) str = `/profile/s/${systemId}/random`
+    else str = "/dash/random";
+    
+    if (itemType === "group") str += "/g";
+    return str;
+}
+
+function capitalizeFirstLetter(string: string) {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+}
 </script>
 
 <Card class="mb-3">
@@ -210,6 +227,9 @@ addFormatter({
             </InputGroup>
         </Col>
         {/if}
+        <Col xs={12} lg={3} class="mb-2">
+            <Link to={getRandomizerUrl()}><Button class="w-100" color="secondary" tabindex={-1} aria-label={`randomize ${itemType}s`}>Random {capitalizeFirstLetter(itemType)}</Button></Link>
+        </Col>
     </Row>
     {#if !isPublic}
     <hr/>
@@ -220,14 +240,29 @@ addFormatter({
     <Svelecte disableHighlight renderer="member-list" valueAsObject bind:value={selectedGroups} options={memberList} multiple style="margin-bottom: 0.5rem" />
     {/if}
 
-    <span style="cursor: pointer" id="m-include" on:click={() => groupSearchMode = "include"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "include" : ""} tabindex={0}>{@html groupSearchMode === "include" ? "<b>include</b>" : "include"}</span>
-     | <span style="cursor: pointer" id="m-exclude" on:click={() => groupSearchMode = "exclude"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "exclude" : ""} tabindex={0}>{@html groupSearchMode === "exclude" ? "<b>exclude</b>" : "exclude"}</span> 
-     | <span style="cursor: pointer" id="m-match" on:click={() => groupSearchMode = "match"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "match" : ""} tabindex={0}>{@html groupSearchMode === "match" ? "<b>exact match</b>" : "exact match"}</span>
-     | <span style="cursor: pointer" id="m-none" on:click={() => groupSearchMode = "none"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "none" : ""} tabindex={0}>{@html groupSearchMode === "none" ? "<b>none</b>" : "none"}</span>
-    <Tooltip placement="bottom" target="m-include">Includes every member who's a part of any of the groups.</Tooltip>
+    <div class="filter-mode-group">
+    <span class="filter-mode-label" id="m-include" on:click={() => groupSearchMode = "include"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "include" : ""} tabindex={0}>{@html groupSearchMode === "include" ? "<b>include</b>" : "include"}</span>
+     | <span class="filter-mode-label" id="m-exclude" on:click={() => groupSearchMode = "exclude"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "exclude" : ""} tabindex={0}>{@html groupSearchMode === "exclude" ? "<b>exclude</b>" : "exclude"}</span> 
+     | <span class="filter-mode-label" id="m-match" on:click={() => groupSearchMode = "match"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "match" : ""} tabindex={0}>{@html groupSearchMode === "match" ? "<b>exact match</b>" : "exact match"}</span>
+     | <span class="filter-mode-label" id="m-none" on:click={() => groupSearchMode = "none"} on:keyup={e => e.key === "Enter" ? groupSearchMode = "none" : ""} tabindex={0}>{@html groupSearchMode === "none" ? "<b>none</b>" : "none"}</span>
+    </div>
+     <Tooltip placement="bottom" target="m-include">Includes every member who's a part of any of the groups.</Tooltip>
     <Tooltip placement="bottom" target="m-exclude">Excludes every member who's a part of any of the groups, the opposite of include.</Tooltip>
     <Tooltip placement="bottom" target="m-match">Only includes members who are a part of every group.</Tooltip>
     <Tooltip placement="bottom" target="m-none">Only includes members that are in no groups.</Tooltip>
     {/if}
 </CardBody>
-</Card>
\ No newline at end of file
+</Card>
+
+<style>
+    .filter-mode-label {
+        cursor: pointer;
+    }
+
+    .filter-mode-group {
+        line-height: 1.5em;
+        padding:0.375rem 0;
+        display: inline-block;
+        margin-bottom: 0.25em;
+    }
+</style>
\ No newline at end of file
diff --git a/dashboard/src/pages/Random.svelte b/dashboard/src/pages/Random.svelte
new file mode 100644
index 00000000..5ef554bb
--- /dev/null
+++ b/dashboard/src/pages/Random.svelte
@@ -0,0 +1,291 @@
+<script lang="ts">
+    import { onMount } from 'svelte';
+    import { Link, useLocation, useParams, navigate } from 'svelte-navigator';
+    import { Alert, Col, Container, Row, Card, CardBody, CardHeader, CardTitle, Input, Label, Button, Accordion, AccordionHeader, AccordionItem } from 'sveltestrap';
+    import FaRandom from 'svelte-icons/fa/FaRandom.svelte'
+    
+    import MemberBody from '../lib/member/Body.svelte';
+    import GroupBody from '../lib/group/Body.svelte';
+    import CardsHeader from '../lib/CardsHeader.svelte';
+    import api from '../api';
+    import { Group, Member } from '../api/types';
+    import FaUserCircle from 'svelte-icons/fa/FaUserCircle.svelte';
+    import FaUsers from 'svelte-icons/fa/FaUsers.svelte';
+    import FaLock from 'svelte-icons/fa/FaLock.svelte';
+
+    export let isPublic: boolean = false;
+    export let type: string = "member";
+    export let pickFromGroup: boolean = false;
+
+    let list: Member[]|Group[] = [];
+    let randomList: Member[]|Group[] = [];
+    
+    let loading = true;
+    let err: string;
+
+    let params = useParams();
+    $: id = $params.id;
+    $: groupId = $params.groupId;
+
+    let location = useLocation();
+    let searchParams = $location.search && new URLSearchParams($location.search);
+
+    let path = $location.pathname;
+
+    let amount: number = 1;
+
+    if (searchParams && searchParams.get("amount")) {
+        amount = parseInt(searchParams.get("amount"));
+        if (amount === NaN) amount = 1;
+        else if (amount > 5) amount = 5;
+    }
+
+    let usePrivateMembers = false;
+
+    if (searchParams && searchParams.get("all") === "true") usePrivateMembers = true;
+
+    let allowDoubles = false;
+    if (searchParams && searchParams.get("doubles") === "true") allowDoubles = true;
+
+    // just a hidden option to expand the cards by default regardless of your global settings
+    let openByDefault = false;
+    if (searchParams && searchParams.get("open") === "true") openByDefault = true;
+
+    let settings = JSON.parse(localStorage.getItem("pk-settings"));
+    
+    onMount(async () => {
+        await fetchList(amount, usePrivateMembers);
+    });
+
+    async function fetchList(amount: number, usePrivateMembers?: boolean|string) {
+        err = "";
+        loading = true;
+        try {
+            if (type === "member") { 
+                if (pickFromGroup) {
+                    const res: Member[] = await api().groups(groupId).members.get({auth: !isPublic});
+                    list = res;
+                } else {
+                    const res: Member[] = await api().systems(isPublic ? id : "@me").members.get({ auth: !isPublic });
+                    list = res;
+                }
+            }
+            else if (type === "group") {
+                const res: Group[] = await api().systems(isPublic ? id : "@me").groups.get({ auth: !isPublic });
+                list = res;
+            }
+            else throw new Error(`Unknown list type ${type}`);
+            randomList = randomizeList(amount, usePrivateMembers, allowDoubles);
+        } catch (error) {
+            console.log(error);
+            err = error.message;
+        }
+        loading = false;
+    }
+
+    function randomizeList(amount: number, usePrivateMembers?: boolean|string, allowDoubles?: boolean|string) {
+        err = "";
+        let filteredList = [...list];
+        if (!isPublic && (!usePrivateMembers || usePrivateMembers === "false")) filteredList = (list as Member[]).filter(item => item.privacy && item.privacy.visibility === "public" ? true : false);
+
+        let cappedAmount = amount;
+        if (amount > filteredList.length) cappedAmount = filteredList.length;
+
+        if (cappedAmount === 0) err = `No valid ${type}s could be randomized. ${!isPublic ? `If every ${type} is privated, roll again with private ${type}s included.` : ""}`;
+
+        let tempList = [];
+        for (let i = 0; i < cappedAmount; i++) {
+            let index = Math.floor(Math.random() * filteredList.length);
+            tempList.push(filteredList[index]);
+           
+            if (!allowDoubles || allowDoubles === "false") {
+                filteredList.splice(index, 1);
+            }
+        }
+        return tempList;
+    }
+
+    function rerollList() {
+        let amount = parseInt(optionAmount);
+        let paramArray = [];
+        if (amount > 1) paramArray.push(`amount=${amount}`);
+        if (optionAllowDoubles === "true") paramArray.push("doubles=true");
+        if (optionUsePrivateMembers === "true") paramArray.push("all=true");
+        if (openByDefault === true) paramArray.push("open=true");
+        
+        randomList = randomizeList(parseInt(optionAmount), optionUsePrivateMembers, optionAllowDoubles);
+        navigate(`${path}${paramArray.length > 0 ? `?${paramArray.join('&')}` : ""}`);
+    }
+
+    function capitalizeFirstLetter(string: string) {
+        return string.charAt(0).toUpperCase() + string.slice(1);
+    }
+    
+    let optionAmount = amount.toString();
+    
+    let optionUsePrivateMembers = "false";
+    if (usePrivateMembers === true) optionUsePrivateMembers = "true";
+
+    let optionAllowDoubles = "false";
+    if (allowDoubles === true) optionAllowDoubles = "true";
+
+    function getItemLink(item: Member | Group): string {
+        let url: string;
+
+        if (isPublic) url = "/dash/";
+        else url = "/profile/";
+        
+        if (type === "member") url += "m/";
+        else if (type === "group") url += "g/";
+
+        url += item.id;
+
+        return url;
+    }
+
+    function getBackUrl() {
+        let str: string;
+        if (isPublic)  { 
+            str = "/profile";
+            if (!pickFromGroup) str += `/s/${id}`;
+        } else str = "/dash"
+        
+        if (pickFromGroup) str += `/g/${groupId}`;
+
+        return str;
+    }
+</script>
+
+<Container>
+    <Row>
+        <Col class="mx-auto" xs={12} lg={11} xl={10}>
+            <Card class="mb-4">
+                <CardHeader>
+                    <CardTitle style="margin-top: 8px; outline: none;">
+                    <div class="icon d-inline-block">
+                        <FaRandom />
+                    </div>Randomize {capitalizeFirstLetter(type)}s {isPublic && id ? `(${id})` : pickFromGroup ? `(${groupId})` : ""}</CardTitle>
+                </CardHeader>
+                <CardBody>
+                    <Row>
+                        <Col xs={12} lg={4} class="mb-2">
+                            <Label>Amount:</Label>
+                            <Input bind:value={optionAmount} type="select" aria-label="amount">
+                                <option default={amount === 1}>1</option>
+                                <option default={amount === 2}>2</option>
+                                <option default={amount === 3}>3</option>
+                                <option default={amount === 4}>4</option>
+                                <option default={amount === 5}>5</option>
+                            </Input>
+                        </Col>
+                        <Col xs={12} lg={4} class="mb-2">
+                            <Label>Allow duplicates:</Label>
+                            <Input bind:value={optionAllowDoubles} type="select" aria-label="allow duplicates">
+                                <option value="false" default={allowDoubles === false}>no</option>
+                                <option value="true" default={allowDoubles === true}>yes</option>
+                            </Input>
+                        </Col>
+                        {#if !isPublic}
+                        <Col xs={12} lg={4} class="mb-2">
+                            <Label>Use all members:</Label>
+                            <Input bind:value={optionUsePrivateMembers} type="select" aria-label="include private members">
+                                <option value="false" default={usePrivateMembers === false}>no (only public members)</option>
+                                <option value="true" default={usePrivateMembers === true}>yes (include private members)</option>
+                            </Input>
+                        </Col>
+                        {/if}
+                    </Row>
+                    <Button color="primary" on:click={() => {rerollList()}}>
+                        Reroll list
+                    </Button>
+                    <Link to={getBackUrl()}>
+                        <Button color="secondary" tabindex={-1} aria-label={`back to ${pickFromGroup ? "group" : "system"}`}>
+                            Back to {pickFromGroup ? "group" : "system"}
+                        </Button>
+                    </Link>
+                </CardBody>
+            </Card>
+            {#if loading}
+                <span>loading...</span>
+            {:else if err}
+                <Alert color="danger">{err}</Alert>
+            {:else}
+            {#if !openByDefault && (settings && settings.accessibility ? (!settings.accessibility.expandedcards && !settings.accessibility.pagelinks) : true)}
+            <Accordion class="my-3" stayOpen>
+                {#each randomList as item, index (item.id + index)}
+                <AccordionItem>
+                    <CardsHeader {item} slot="header">
+                        <div slot="icon">
+                            {#if isPublic || item.privacy.visibility === "public"}
+                            {#if type === "member"}
+                            <FaUserCircle />
+                            {:else if type === "group"}
+                            <FaUsers />
+                            {/if}
+                            {:else}
+                            <FaLock />
+                            {/if}
+                        </div>
+                    </CardsHeader>
+                    {#if type === "member"}
+                    <MemberBody isPublic={true} bind:member={item} isMainDash={false} />
+                    {:else if type === "group"}
+                    <GroupBody isPublic={true} bind:group={item} isMainDash={false} />
+                    {/if}
+                </AccordionItem>
+                {/each}
+            </Accordion>
+            {:else if openByDefault || settings.accessibility.expandedcards}
+                {#each randomList as item, index (item.id + index)}
+                <Card class="mb-3">
+                    <CardHeader>
+                        <CardsHeader {item}>
+                            <div slot="icon">
+                                {#if isPublic || item.privacy.visibility === "public"}
+                                {#if type === "member"}
+                                <FaUserCircle />
+                                {:else if type === "group"}
+                                <FaUsers />
+                                {/if}
+                                {:else}
+                                <FaLock />
+                                {/if}
+                            </div>
+                        </CardsHeader>
+                    </CardHeader>
+                    <CardBody>
+                        {#if type === "member"}
+                        <MemberBody isPublic={true} bind:member={item} isMainDash={false} />
+                        {:else if type === "group"}
+                        <GroupBody isPublic={true} bind:group={item} isMainDash={false} />
+                        {/if}
+                    </CardBody>
+                </Card>
+                {/each}
+            {:else}
+                <div class="my-3">
+                {#each randomList as item, index (item.id + index)}
+                <Card>
+                    <Link class="accordion-button collapsed" style="text-decoration: none;" to={getItemLink(item)}>
+                        <CardsHeader {item}>
+                            <div slot="icon">
+                                {#if isPublic || item.privacy.visibility === "public"}
+                                {#if type === "member"}
+                                <FaUserCircle />
+                                {:else if type === "group"}
+                                <FaUsers />
+                                {/if}
+                                {:else}
+                                <FaLock />
+                                {/if}
+                            </div>
+                        </CardsHeader>
+                    </Link>
+                </Card>
+                {/each}
+                </div>
+            {/if}
+            {/if}
+        </Col>
+    </Row>
+</Container>
\ No newline at end of file