Design guidelines: Form and form control

packages/documentation-site/patternfly-docs/content/components/checkbox/checkbox.md

@@ -10,13 +10,13 @@ import '../components.css';
 Checkboxes allow users to choose **1 or more items** from a list of options.
 
 <div class="ws-docs-content-img">
-![Example of a form question with mutliple checkbox options stacked vertically.](./img/CB-usage-multi.svg)
+![Example of a form question with mutliple checkbox options stacked vertically.](./img/checkbox-usage-multi.svg)
 </div>
 
 You can also use a single checkbox to allow a user to enable or disable a feature or setting, along with a save button. 
 
 <div class="ws-docs-content-img">
-![Example of a single checkbox.](./img/CB-usage-single.svg)
+![Example of a single checkbox.](./img/checkbox-usage-single.svg)
 </div>
 
 ### When to use
@@ -32,13 +32,13 @@ Checkbox labels fall to the right of the checkbox control. If placed vertically,
 You can use headings to label a group of checkboxes. The placement of headings will depend on the layout of other content in the form or on the page you’re designing. For more information on how to arrange checkboxes, see our [forms documentation](/components/forms/form/design-guidelines).
 
 <div class="ws-docs-content-img">
-![Example of a group of checkboxes.](./img/CB-alignment.svg)
+![Example of a group of checkboxes.](./img/checkbox-alignment.svg)
 </div>
 
 You also have the option to use progressive disclosure by nesting other controls underneath a checkbox. The nested options would be enabled or disabled when the user selects or deselects a checkbox.
 
 <div class="ws-docs-content-img">
-![Example of nested control checkboxes.](./img/CB-nested.svg)
+![Example of nested control checkboxes.](./img/checkbox-nested.svg)
 </div>
 
 ### When to use switches vs. checkboxes
@@ -47,20 +47,20 @@ The main difference between a switch and a checkbox is that a switch changes an
 * Use checkboxes when the options do not save automatically and require the user to perform an additional action to save changes (in this case, pressing the “Save changes” button).
 
     <div class="ws-docs-content-img">
-    ![Example 1 of do's and don'ts for using a checkbox or a switch.](./img/CB-vs-switch-1.svg)
+    ![Example 1 of do's and don'ts for using a checkbox or a switch.](./img/checkbox-vs-switch-1.svg)
     </div>
 
 
 * Use a switch for situations where you are turning a series of one or more independent options on or off.
 
     <div class="ws-docs-content-img">
-    ![Example 2 of do's and don'ts for using a checkbox or a switch.](./img/CB-vs-switch-2.svg)
+    ![Example 2 of do's and don'ts for using a checkbox or a switch.](./img/checkbox-vs-switch-2.svg)
     </div>
 
 * Use checkboxes when you may have an indeterminate state where you can select all, none, or some actions.
 
     <div class="ws-docs-content-img">
-    ![Example 3 of do's and don'ts for using a checkbox or a switch.](./img/CB-vs-switch-3.svg)
+    ![Example 3 of do's and don'ts for using a checkbox or a switch.](./img/checkbox-vs-switch-3.svg)
     </div>
 
 ## Accessibility