{"componentChunkName":"component---src-pages-resources-index-mdx","path":"/resources/","result":{"pageContext":{"isCreatedByStatefulCreatePages":true,"frontmatter":{"title":"Resources","description":"Everything you need to work with, learn about, and contribute to Carbon."},"relativePagePath":"/resources/index.mdx","titleType":"prepend","MdxNode":{"id":"444e9f9c-0b3b-5697-a6ba-d6c8aa3c98f3","children":[],"parent":"aee71826-f805-54dd-b622-1e700fb57bc9","internal":{"content":"---\ntitle: Resources\ndescription: Everything you need to work with, learn about, and contribute to Carbon.\n---\n\n<PageDescription>\n\nEverything you need to work with, learn about, and contribute to Carbon.\n\n</PageDescription>\n\n<AnchorLinks>\n\n<AnchorLink>Development resources</AnchorLink>\n<AnchorLink>Design resources</AnchorLink>\n<AnchorLink>Tools</AnchorLink>\n<AnchorLink>Reading</AnchorLink>\n\n</AnchorLinks>\n\n## Development resources\n\n### GitHub repos\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components\"\n    href=\"https://github.com/carbon-design-system/carbon-components\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components React\"\n    href=\"https://github.com/carbon-design-system/carbon-components-react\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components Angular\"\n    href=\"https://github.com/IBM/carbon-components-angular\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components Vue\"\n    href=\"https://github.com/carbon-design-system/carbon-components-vue\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon boilerplate\"\n    href=\"https://github.com/carbon-design-system/carbon-boilerplate\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Charts Core\"\n    href=\"https://github.com/carbon-design-system/carbon-charts/tree/master/packages/core\">\n    <MdxIcon name=\"github\" />\n  </ResourceCard>\n</Column>\n</Row>\n\n### Storybooks\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon React Storybook\"\n    href=\"http://react.carbondesignsystem.com/\"\n    >\n\n![](images/react-icon.png)\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n      subTitle=\"Carbon Components Vue Storybook\"\n      href=\"http://vue.carbondesignsystem.com/\"\n      >\n\n![](images/vue-icon.png)\n\n  </ResourceCard>\n</Column>\n</Row>\n\n## Design resources\n\n### Theme libraries\n\n<Row className=\"resource-card-group\">\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"White theme\"\n      href=\"sketch://add-library/cloud/JaVzz\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Gray 10 theme\"\n      href=\"sketch://add-library/cloud/Onwv2\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Gray 90 theme\"\n      href=\"sketch://add-library/cloud/eo37p\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Gray 100 theme\"\n      href=\"sketch://add-library/cloud/d13Ll\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n</Row>\n\n### Color, grid, and icons\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"RGB color palettes (.ase and .clr)\"\n    href=\"https://github.com/carbon-design-system/carbon/raw/master/packages/colors/artifacts/IBM_Colors.zip\"\n    >\n\n![](/images/ase.png)\n\n  </ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"IBM Design Language library\"\n      href=\"sketch://add-library/cloud/nwqmk\"\n      >\n<MdxIcon name=\"sketch\" />\n  </ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Icons (16px, 20px) library\"\n    href=\"sketch://add-library/cloud/KW2yr\"\n    >\n\n<MdxIcon name=\"sketch\" />\n\n</ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Icons (24px, 32px) library\"\n    href=\"sketch://add-library/cloud/2bwkM\"\n    >\n\n<MdxIcon name=\"sketch\" />\n\n</ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Grid template\"\n    href=\"https://sketch.cloud/s/ngV7z\"\n    >\n\n<MdxIcon name=\"sketch\" />\n\n</ResourceCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterSm>\n  <ResourceCard\n    subTitle=\"UI Shell template\"\n    href=\"https://sketch.cloud/s/EjVmA\"\n    >\n    <MdxIcon name=\"sketch\" />\n  </ResourceCard>\n</Column>\n</Row>\n\n### Data visualizations\n\n<Row className=\"resource-card-group\">\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Download WIP charting design specifications (IBM internal link)\"\n      disabled>\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"UI Shell template\"\n      href=\"https://sketch.cloud/s/EjVmA\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Data visualization color palettes (IBM internal link)\"\n      href=\"https://ibm.box.com/s/3mt8fshtgy70r7rhxjhfo3gbdt0n3x5y\"\n      actionIcon=\"download\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n</Row>\n\n### GitHub repos\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Design Kit\"\n    href=\"https://github.com/carbon-design-system/carbon-design-kit\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Design Language and Icon Kits\"\n    href=\"https://github.com/IBM/design-kit\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n</Row>\n\n<br />\n\n#### IBM Plex\n\nCarbon uses the open-source typeface [IBM Plex](https://github.com/ibm/plex) – carefully designed to meet IBM's needs as a global technology company and reflect IBM's spirit, beliefs, and design principles.\n\n#### IBM Design Language\n\nCarbon delivers the [IBM Design Language](https://www.ibm.com/design/language/) as tools for designers and developers, guidance, tutorials, and support.\n\n## Tools\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon CodePen\"\n    href=\"http://www.codepen.io/team/carbon\"\n    >\n\n<MdxIcon name=\"codepen\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Color contrast checker\"\n    href=\"https://marijohannessen.github.io/color-contrast-checker/\"\n    >\n\n![](images/color-contrast-icon.png)\n\n  </ResourceCard>\n</Column>\n\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Adobe XD Design kit\"\n    href=\" https://github.com/IBM/design-kit/tree/master/Adobe%20XD\"\n    >\n\n![](images/adobe-xd.png)\n\n  </ResourceCard>\n</Column>\n</Row>\n\n## Reading\n\n### Featured stories\n\n<Row>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Smashing Magazine's “Design Systems” Book\"\n    href=\"https://www.smashingmagazine.com/design-systems-book/\">\n\n![](images/Featured_01.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Winter 2017 HOW In-House Design Award Winner\"\n    href=\"http://www.howdesign.com/84-award-winning-projects-from-in-house-design-teams/\">\n\n![](images/Featured_02.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Path to Design System Maturity\"\n    href=\"https://medium.com/ux-power-tools/the-path-to-design-system-maturity-d403daba692a\">\n\n![](images/Featured_03.png)\n\n  </ArticleCard>\n</Column>\n<Column  colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Responsive Web Design Podcast\"\n    href=\"https://responsivewebdesign.com/podcast/ibm-carbon/\">\n\n![](images/Featured_04.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"UX Pin Virtual Design Summit\"\n    href=\"https://www.youtube.com/watch?v=eSvq5MieOdw&t=144s\">\n\n![](images/Featured_05.png)\n\n  </ArticleCard>\n</Column>\n</Row>\n\n### Articles\n\n<Row>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"New in Carbon: October 2019\"\n    author=\"Tyler Tate\"\n    date=\"October 10, 2019\"\n    href=\"https://medium.com/carbondesign/october-release-fadc38b757ad\"\n    >\n\n![](images/v10.7-release.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Help build Carbon — Hacktoberfest 2019\"\n    author=\"Connor Leech\"\n    date=\"October 1, 2019\"\n    href=\"https://medium.com/carbondesign/help-build-carbon-hacktoberfest-2019-dbf337305c92\"\n    >\n\n![](/images/hacktoberfest.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Because, colors are beautiful\"\n    author=\"Shixie Shi Trofimov\"\n    date=\"September 25, 2019\"\n    href=\"https://medium.com/carbondesign/because-colors-are-beautiful-52dd4cc39f09\"\n    >\n\n![](/images/because-colors.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"What’s around the Carbon corner: October 🎃\"\n    author=\"Josefina Mancilla\"\n    date=\"September 6, 2019\"\n    href=\"https://medium.com/carbondesign/whats-around-the-carbon-corner-october-a47532f2933\"\n    >\n\n![](/images/october_release.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon for IBM Security\"\n    author=\"Jen Downs\"\n    date=\"August 20, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-for-ibm-security-986ccfe5c012\"\n    >\n\n![](/images/security_pic.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon: July recap + August preview\"\n    author=\"Josefina Mancilla\"\n    date=\"July 26, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-july-preview-whats-coming-in-august-7a2483ea6ac9\"\n    >\n\n![](/images/Aug_preview_rev_2.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon June(ish) preview\"\n    author=\"Alison Joseph\"\n    date=\"June 12, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-june-ish-preview-9c5843258933\"\n    >\n\n![](../resources/images/june_option_3.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon v10.3.0 (May 2019)\"\n    author=\"Josh Black\"\n    date=\"June 6, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-v10-3-0-may-2019-41b1f970f0ce\"\n    >\n\n![](../resources/images/10_3-image.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Essentials: Learn to build with Carbon\"\n    author=\"Matt Rosno\"\n    date=\"May 15, 2019\"\n    href=\"https://medium.com/carbondesign/essentials-learn-to-build-with-carbon-1d11ce05125f\"\n    >\n\n![](../resources/images/code_palette.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon is moving to a monorepo\"\n    author=\"Josh Black\"\n    date=\"May 10, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-is-moving-to-a-monorepo-c6bfcbe87de0\"\n    >\n\n![](../resources/images/mono_repo_teal.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon dark themes are here\"\n    author=\"Lauren Rice\"\n    date=\"April 29, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-dark-themes-are-here-a18910a0f910\"\n    >\n\n![](../resources/images/carbon_themes.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon v10 Release\"\n    author=\"Robin Cannon\"\n    date=\"April 4, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-v10-release-812eacb7da7f\"\n    >\n\n![](../resources/images/bee_70.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Design with Carbon: Update your Sketch symbols to V10\"\n    author=\"Anna Gonzales\"\n    date=\"April 2, 2019\"\n    href=\"https://medium.com/carbondesign/design-with-carbon-update-your-sketch-symbols-to-v10-ef3132ea2e97\"\n    >\n\n![](../resources/images/designing_with_carbon.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Minimal CSS with Carbon\"\n    author=\"Josh Black\"\n    date=\"April 1, 2019\"\n    href=\"https://medium.com/carbondesign/minimal-css-with-carbon-b0c089ccfa71\"\n    >\n\n![](../resources/images/minimal_css.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"What to expect in Carbon 10\"\n    author=\"Robin Cannon\"\n    date=\"December 10, 2018\"\n    href=\"https://medium.com/carbondesign/what-to-expect-in-carbon-10-5af1bd6e25f6\">\n\n![](images/Carbon_what_to_expect.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Up & Running with Carbon React in less than 5 minutes\"\n    author=\"Josh Black\"\n    date=\"October 19, 2018\"\n    href=\"https://medium.com/carbondesign/up-running-with-carbon-react-in-less-than-5-minutes-25d43cca059e\">\n\n![](images/Article_02.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Hacktoberfest with Carbon\"\n    author=\"Josh Black\"\n    date=\"October 16, 2018\"\n    href=\"https://medium.com/carbondesign/hacktoberfest-with-carbon-95c48943f586\">\n\n![](images/Article_03.png)\n\n  </ArticleCard>\n</Column>\n</Row>\n","type":"Mdx","contentDigest":"ec9f1a6d408e2649a8056c16170b6730","counter":1483,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"Resources","description":"Everything you need to work with, learn about, and contribute to Carbon."},"exports":{},"rawBody":"---\ntitle: Resources\ndescription: Everything you need to work with, learn about, and contribute to Carbon.\n---\n\n<PageDescription>\n\nEverything you need to work with, learn about, and contribute to Carbon.\n\n</PageDescription>\n\n<AnchorLinks>\n\n<AnchorLink>Development resources</AnchorLink>\n<AnchorLink>Design resources</AnchorLink>\n<AnchorLink>Tools</AnchorLink>\n<AnchorLink>Reading</AnchorLink>\n\n</AnchorLinks>\n\n## Development resources\n\n### GitHub repos\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components\"\n    href=\"https://github.com/carbon-design-system/carbon-components\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components React\"\n    href=\"https://github.com/carbon-design-system/carbon-components-react\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components Angular\"\n    href=\"https://github.com/IBM/carbon-components-angular\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Components Vue\"\n    href=\"https://github.com/carbon-design-system/carbon-components-vue\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon boilerplate\"\n    href=\"https://github.com/carbon-design-system/carbon-boilerplate\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Charts Core\"\n    href=\"https://github.com/carbon-design-system/carbon-charts/tree/master/packages/core\">\n    <MdxIcon name=\"github\" />\n  </ResourceCard>\n</Column>\n</Row>\n\n### Storybooks\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon React Storybook\"\n    href=\"http://react.carbondesignsystem.com/\"\n    >\n\n![](images/react-icon.png)\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n      subTitle=\"Carbon Components Vue Storybook\"\n      href=\"http://vue.carbondesignsystem.com/\"\n      >\n\n![](images/vue-icon.png)\n\n  </ResourceCard>\n</Column>\n</Row>\n\n## Design resources\n\n### Theme libraries\n\n<Row className=\"resource-card-group\">\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"White theme\"\n      href=\"sketch://add-library/cloud/JaVzz\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Gray 10 theme\"\n      href=\"sketch://add-library/cloud/Onwv2\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Gray 90 theme\"\n      href=\"sketch://add-library/cloud/eo37p\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Gray 100 theme\"\n      href=\"sketch://add-library/cloud/d13Ll\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n</Row>\n\n### Color, grid, and icons\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"RGB color palettes (.ase and .clr)\"\n    href=\"https://github.com/carbon-design-system/carbon/raw/master/packages/colors/artifacts/IBM_Colors.zip\"\n    >\n\n![](/images/ase.png)\n\n  </ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"IBM Design Language library\"\n      href=\"sketch://add-library/cloud/nwqmk\"\n      >\n<MdxIcon name=\"sketch\" />\n  </ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Icons (16px, 20px) library\"\n    href=\"sketch://add-library/cloud/KW2yr\"\n    >\n\n<MdxIcon name=\"sketch\" />\n\n</ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Icons (24px, 32px) library\"\n    href=\"sketch://add-library/cloud/2bwkM\"\n    >\n\n<MdxIcon name=\"sketch\" />\n\n</ResourceCard>\n</Column>\n<Column colMd={4} colLg={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Grid template\"\n    href=\"https://sketch.cloud/s/ngV7z\"\n    >\n\n<MdxIcon name=\"sketch\" />\n\n</ResourceCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterSm>\n  <ResourceCard\n    subTitle=\"UI Shell template\"\n    href=\"https://sketch.cloud/s/EjVmA\"\n    >\n    <MdxIcon name=\"sketch\" />\n  </ResourceCard>\n</Column>\n</Row>\n\n### Data visualizations\n\n<Row className=\"resource-card-group\">\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Download WIP charting design specifications (IBM internal link)\"\n      disabled>\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"UI Shell template\"\n      href=\"https://sketch.cloud/s/EjVmA\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n  <Column colLg={4} colMd={4} noGutterSm>\n    <ResourceCard\n      subTitle=\"Data visualization color palettes (IBM internal link)\"\n      href=\"https://ibm.box.com/s/3mt8fshtgy70r7rhxjhfo3gbdt0n3x5y\"\n      actionIcon=\"download\">\n      <MdxIcon name=\"sketch\" />\n    </ResourceCard>\n  </Column>\n</Row>\n\n### GitHub repos\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon Design Kit\"\n    href=\"https://github.com/carbon-design-system/carbon-design-kit\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"IBM Design Language and Icon Kits\"\n    href=\"https://github.com/IBM/design-kit\"\n    >\n\n<MdxIcon name=\"github\" />\n\n  </ResourceCard>\n</Column>\n</Row>\n\n<br />\n\n#### IBM Plex\n\nCarbon uses the open-source typeface [IBM Plex](https://github.com/ibm/plex) – carefully designed to meet IBM's needs as a global technology company and reflect IBM's spirit, beliefs, and design principles.\n\n#### IBM Design Language\n\nCarbon delivers the [IBM Design Language](https://www.ibm.com/design/language/) as tools for designers and developers, guidance, tutorials, and support.\n\n## Tools\n\n<Row className=\"resource-card-group\">\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Carbon CodePen\"\n    href=\"http://www.codepen.io/team/carbon\"\n    >\n\n<MdxIcon name=\"codepen\" />\n\n  </ResourceCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Color contrast checker\"\n    href=\"https://marijohannessen.github.io/color-contrast-checker/\"\n    >\n\n![](images/color-contrast-icon.png)\n\n  </ResourceCard>\n</Column>\n\n<Column colLg={4} colMd={4} noGutterSm>\n  <ResourceCard\n    subTitle=\"Adobe XD Design kit\"\n    href=\" https://github.com/IBM/design-kit/tree/master/Adobe%20XD\"\n    >\n\n![](images/adobe-xd.png)\n\n  </ResourceCard>\n</Column>\n</Row>\n\n## Reading\n\n### Featured stories\n\n<Row>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Smashing Magazine's “Design Systems” Book\"\n    href=\"https://www.smashingmagazine.com/design-systems-book/\">\n\n![](images/Featured_01.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Winter 2017 HOW In-House Design Award Winner\"\n    href=\"http://www.howdesign.com/84-award-winning-projects-from-in-house-design-teams/\">\n\n![](images/Featured_02.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Path to Design System Maturity\"\n    href=\"https://medium.com/ux-power-tools/the-path-to-design-system-maturity-d403daba692a\">\n\n![](images/Featured_03.png)\n\n  </ArticleCard>\n</Column>\n<Column  colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Responsive Web Design Podcast\"\n    href=\"https://responsivewebdesign.com/podcast/ibm-carbon/\">\n\n![](images/Featured_04.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"UX Pin Virtual Design Summit\"\n    href=\"https://www.youtube.com/watch?v=eSvq5MieOdw&t=144s\">\n\n![](images/Featured_05.png)\n\n  </ArticleCard>\n</Column>\n</Row>\n\n### Articles\n\n<Row>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"New in Carbon: October 2019\"\n    author=\"Tyler Tate\"\n    date=\"October 10, 2019\"\n    href=\"https://medium.com/carbondesign/october-release-fadc38b757ad\"\n    >\n\n![](images/v10.7-release.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Help build Carbon — Hacktoberfest 2019\"\n    author=\"Connor Leech\"\n    date=\"October 1, 2019\"\n    href=\"https://medium.com/carbondesign/help-build-carbon-hacktoberfest-2019-dbf337305c92\"\n    >\n\n![](/images/hacktoberfest.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Because, colors are beautiful\"\n    author=\"Shixie Shi Trofimov\"\n    date=\"September 25, 2019\"\n    href=\"https://medium.com/carbondesign/because-colors-are-beautiful-52dd4cc39f09\"\n    >\n\n![](/images/because-colors.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"What’s around the Carbon corner: October 🎃\"\n    author=\"Josefina Mancilla\"\n    date=\"September 6, 2019\"\n    href=\"https://medium.com/carbondesign/whats-around-the-carbon-corner-october-a47532f2933\"\n    >\n\n![](/images/october_release.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon for IBM Security\"\n    author=\"Jen Downs\"\n    date=\"August 20, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-for-ibm-security-986ccfe5c012\"\n    >\n\n![](/images/security_pic.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon: July recap + August preview\"\n    author=\"Josefina Mancilla\"\n    date=\"July 26, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-july-preview-whats-coming-in-august-7a2483ea6ac9\"\n    >\n\n![](/images/Aug_preview_rev_2.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon June(ish) preview\"\n    author=\"Alison Joseph\"\n    date=\"June 12, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-june-ish-preview-9c5843258933\"\n    >\n\n![](../resources/images/june_option_3.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon v10.3.0 (May 2019)\"\n    author=\"Josh Black\"\n    date=\"June 6, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-v10-3-0-may-2019-41b1f970f0ce\"\n    >\n\n![](../resources/images/10_3-image.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Essentials: Learn to build with Carbon\"\n    author=\"Matt Rosno\"\n    date=\"May 15, 2019\"\n    href=\"https://medium.com/carbondesign/essentials-learn-to-build-with-carbon-1d11ce05125f\"\n    >\n\n![](../resources/images/code_palette.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon is moving to a monorepo\"\n    author=\"Josh Black\"\n    date=\"May 10, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-is-moving-to-a-monorepo-c6bfcbe87de0\"\n    >\n\n![](../resources/images/mono_repo_teal.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon dark themes are here\"\n    author=\"Lauren Rice\"\n    date=\"April 29, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-dark-themes-are-here-a18910a0f910\"\n    >\n\n![](../resources/images/carbon_themes.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n<ArticleCard\n    title=\"Carbon v10 Release\"\n    author=\"Robin Cannon\"\n    date=\"April 4, 2019\"\n    href=\"https://medium.com/carbondesign/carbon-v10-release-812eacb7da7f\"\n    >\n\n![](../resources/images/bee_70.png)\n\n</ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Design with Carbon: Update your Sketch symbols to V10\"\n    author=\"Anna Gonzales\"\n    date=\"April 2, 2019\"\n    href=\"https://medium.com/carbondesign/design-with-carbon-update-your-sketch-symbols-to-v10-ef3132ea2e97\"\n    >\n\n![](../resources/images/designing_with_carbon.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Minimal CSS with Carbon\"\n    author=\"Josh Black\"\n    date=\"April 1, 2019\"\n    href=\"https://medium.com/carbondesign/minimal-css-with-carbon-b0c089ccfa71\"\n    >\n\n![](../resources/images/minimal_css.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"What to expect in Carbon 10\"\n    author=\"Robin Cannon\"\n    date=\"December 10, 2018\"\n    href=\"https://medium.com/carbondesign/what-to-expect-in-carbon-10-5af1bd6e25f6\">\n\n![](images/Carbon_what_to_expect.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4} noGutterMdLeft>\n  <ArticleCard\n    title=\"Up & Running with Carbon React in less than 5 minutes\"\n    author=\"Josh Black\"\n    date=\"October 19, 2018\"\n    href=\"https://medium.com/carbondesign/up-running-with-carbon-react-in-less-than-5-minutes-25d43cca059e\">\n\n![](images/Article_02.png)\n\n  </ArticleCard>\n</Column>\n<Column colLg={4} colMd={4}  noGutterMdLeft>\n  <ArticleCard\n    title=\"Hacktoberfest with Carbon\"\n    author=\"Josh Black\"\n    date=\"October 16, 2018\"\n    href=\"https://medium.com/carbondesign/hacktoberfest-with-carbon-95c48943f586\">\n\n![](images/Article_03.png)\n\n  </ArticleCard>\n</Column>\n</Row>\n","fileAbsolutePath":"/zeit/3ed0734e/src/pages/resources/index.mdx"}}}}