Skip to content
shadcn.io

React Styleguidist

The react-styleguidist icon represents the React Styleguidist library, a tool for generating style guides and documentation for React components.

Add shadcn.io to your AI agent. · Pro It installs React Styleguidist, or any of 294k icons, from a prompt, with Pro.

Set up MCP

Exports at 35 × 24 px

React Styleguidist icon from SVG Logos
Get Pro

2,063 in SVG LogosCC0 license (opens in a new tab)Free to copy and download

Code

React Styleguidist in your framework

In any framework. Customize it above, and the code follows.

export const ReactStyleguidistIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="35" height="24" viewBox="0 0 256 174" {...props}>
    <defs><path id="SVGblPwNdAk" d="M40.822 49.107s-12.744 3.42-19.116 3.42s-18.882-3.42-18.882-3.42A1.965 1.965 0 0 1 .86 47.143V2.677A1.965 1.965 0 0 1 2.824.712h37.998c1.085 0 1.964.88 1.964 1.965v44.466a1.964 1.964 0 0 1-1.964 1.964"/><path id="SVGNzBL808u" d="M53.282 84.012s-11.348 2.281-17.023 2.281c-5.573 0-16.719-2.281-16.719-2.281C9.125 84.012.682 77.85.682 67.435v-30.87C.682 16.85 16.664.868 36.377.868C56.16.87 72.14 16.85 72.14 36.564v30.871c0 10.415-8.443 16.577-18.858 16.577"/><path id="SVGorFsndkp" fill="#00D8FE" d="M69.51 119.463L64.802 95.35c-1.186-10.233-8.907-19.86-18.985-22.577l-.822-.221c-.663-.181-1.403-.389-2.2-.62a139 139 0 0 1-6.667-2.1c-2.555-.882-4.695-1.736-6.259-2.52a14 14 0 0 1-1.534-.872c-.34-.228-.563-.417-.652-.527c-1.853-2.271-2.159-3.534-2.159-7.146c0-.124.061-.275.166-.39c.023-.024 21.316 5.544 21.316 5.544c7.107 1.618 13.287 4.789 18.182 9.685c5.748 5.75 9.619 13.763 11.236 24.265l4.532 33.288c1.244 10.143 5.784 16.854 13.238 16.854c8.239 0 12.684-4.146 12.706-13.108l.812-14.201l17.541-.123v8.609c0 8.44-2.552 16.85-7.231 23.054c-5.237 6.942-12.802 10.828-22.416 10.828a23 23 0 0 1-2.86-.173c-12.215-.745-20.551-9.07-28.215-25.839l-10.944-26.232c-3.613-6.913-11.022-12.41-19.007-15.07l-8.989-1.93c-2.986-.628-6.279-2.3-7.495-3.803c-1.575-1.945-2.6-4.433-2.6-6.56c0-.262.258-1.003.64-1.622c.117-.187.234-.349.342-.475l19.531 5.017c12.28 2.399 19.784 7.682 25.527 17.622z"/><path id="SVGckwuItjE" fill="#00D8FE" d="m185.703 119.463l4.707-24.113c1.186-10.233 8.907-19.86 18.985-22.577q1.515-.405 3.023-.84c2.276-.66 4.55-1.369 6.666-2.1c2.556-.883 4.695-1.737 6.26-2.52a14 14 0 0 0 1.533-.873c.34-.228.563-.417.652-.527c1.853-2.271 2.159-3.534 2.159-7.146a.6.6 0 0 0-.166-.39c-.023-.024-21.315 5.544-21.315 5.544c-7.108 1.618-13.288 4.789-18.183 9.685c-5.748 5.75-9.618 13.763-11.236 24.265l-4.532 33.288c-1.244 10.143-5.784 16.854-13.238 16.854c-8.239 0-12.683-4.146-12.706-13.108l-.811-14.201l-17.542-.123v8.609c0 8.44 2.553 16.85 7.232 23.054c5.236 6.942 12.801 10.828 22.415 10.828q1.478 0 2.86-.173c12.215-.745 20.551-9.07 28.215-25.839l10.944-26.232c3.614-6.913 11.023-12.41 19.007-15.07l8.99-1.93c2.985-.628 6.278-2.3 7.495-3.803c1.574-1.945 2.598-4.433 2.598-6.56c0-.262-.257-1.003-.64-1.622a4 4 0 0 0-.34-.475l-19.532 5.017c-12.28 2.399-19.784 7.682-25.527 17.622z"/></defs><path fill="#053949" d="M75.537 157.505c4.768 6.654 11.494 10.273 20.07 10.273c11.112 0 20.058-4.595 26.172-12.701c5.325-7.06 8.18-16.467 8.18-25.887v-13.348l-26.694.187l-1.07 18.74c0 6.407-2.274 8.538-8 8.538c-4.436 0-7.577-4.643-8.572-12.752l-4.541-33.36C79.31 85.693 74.995 76.76 68.516 70.28c-5.551-5.553-12.514-9.13-20.348-10.918L26.165 53.56c-3.103 0-5.347 2.437-5.347 5.208c0 4.594.545 6.844 3.218 10.12c.765.938 1.999 1.768 3.725 2.633c1.782.892 4.095 1.816 6.83 2.76c2.2.761 4.548 1.494 6.896 2.173q1.45.42 2.908.811c8.373 2.257 14.802 10.298 15.741 18.706l7.626 39.076c1.19 9.134 3.73 16.817 7.775 22.459m54.203-41.021h-25.544l.038 2.39l.242 15.108c0 6.323-4.585 10.203-10.773 10.203c-4.448 0-8.618-4.69-13.591-14.435l-14.445-27.998c-6.448-11.189-15.102-17.303-28.62-19.958l-20.483-5.262c-3.27 0-5.773 4.047-5.773 6.934c0 3.298 1.438 6.792 3.647 9.52c1.995 2.466 6.232 4.616 10.178 5.445l8.599 1.833c6.832 2.307 13.164 7.01 16.11 12.567l10.878 26.077c4.1 8.983 8.296 15.557 13.313 20.302c5.878 5.56 12.802 8.45 21.064 8.45c7.57 0 15.425-2.693 21.501-7.517c6.754-5.362 10.9-12.948 11.451-21.951z"/><use href="#SVGorFsndkp"/><use href="#SVGorFsndkp"/><path fillOpacity=".25" d="M16.414 80.975a12.6 12.6 0 0 0 1.434 1.992c1.32 1.503 4.896 3.174 8.138 3.801l9.76 1.93c8.67 2.662 16.713 8.159 20.637 15.071l11.882 26.232c1.616 3.257 3.26 6.195 4.957 8.822a73 73 0 0 1-.803-4.927l-2.91-14.904l-7.973-15.456c-5.743-9.94-13.248-15.223-25.527-17.622l-19.531-5.016z"/><path fillOpacity=".25" d="M111.606 120.673v13.223c0 9.08-3.662 18.352-16.544 18.352c-7.839 0-15.823-4.825-18.427-22.99l-5.064-34.892c-1.314-10.233-11.5-24.523-22.671-27.24c-.428-.102-15.944-4.677-17.677-5.46c-.69-.312-2.325-1.29-2.424-1.4c-.6-.663-1.053-1.24-1.395-1.815c2.54.654 20.559 5.47 20.559 5.47c6.954 1.618 13 4.789 17.789 9.685c5.624 5.75 9.41 13.763 10.993 24.265l4.434 33.288c1.218 10.143 5.66 16.854 12.952 16.854c8.06 0 12.41-4.146 12.43-13.108l.795-14.201z"/><path fill="#053949" d="M130.43 132.013v-16.47h-27.294v2.353c0 21.18-5.805 30.352-18.824 30.352c-11.488 0-19.39-8.207-24.42-21.672c-5.74-15.362-14.442-22.328-31.41-22.328H5.254c-2.935 0-5.253 2.421-5.253 5.345a13.73 13.73 0 0 0 4.04 9.739a13.77 13.77 0 0 0 9.766 4.036l14.733-.06c3.062 0 6.021 2.24 9.061 6.82c2.534 3.817 4.668 8.34 8.06 16.559c3.04 7.368 7.21 13.615 12.784 18.321c6.82 5.76 15.406 8.888 25.868 8.888c11.263 0 22.72-4.106 31.373-11.293c9.34-7.76 14.745-18.467 14.745-30.59"/><path fill="#00D8FE" d="M125.724 120.248v11.765c0 10.671-4.746 20.075-13.046 26.97c-7.805 6.483-18.197 10.207-28.366 10.207c-9.352 0-16.862-2.737-22.832-7.777c-4.94-4.17-8.696-9.8-11.47-16.522c-3.507-8.498-5.73-13.21-8.49-17.365c-3.821-5.759-8.002-8.925-12.991-8.925l-14.733.061a9.06 9.06 0 0 1-6.43-2.66a9.02 9.02 0 0 1-2.66-6.41c0-.368.258-.638.547-.638h23.23c14.863 0 21.909 5.64 27 19.269c2.433 6.513 5.629 12.125 9.747 16.402c5.165 5.364 11.524 8.33 19.082 8.33c15.635 0 23.02-10.83 23.504-32.707z"/><path fillOpacity=".25" d="M4.851 109.159c.43.545 1.036 1.035 1.794 1.723c1.621 1.47 3.802 2.308 6.138 2.308h19.294c10.755 0 16.347 8.402 23.371 23.87c2.648 5.828 9.869 19.894 30.276 19.894s26.353-19.922 26.353-29.176v-7.53h-4.261c-.485 21.877-7.869 32.706-23.504 32.706c-7.558 0-13.917-2.965-19.082-8.33c-4.118-4.276-7.314-9.888-9.747-16.401c-5.091-13.629-12.137-19.269-27-19.269H5.253c-.154 0-.3.077-.402.205"/><path fill="#053949" d="M179.675 157.505c-4.768 6.654-11.494 10.273-20.069 10.273c-11.113 0-20.06-4.595-26.173-12.701c-5.325-7.06-8.18-16.467-8.18-25.887v-13.348l26.694.187l1.07 18.74c0 6.407 2.274 8.538 8 8.538c4.437 0 7.577-4.643 8.572-12.752l4.541-33.36c1.772-11.502 6.087-20.435 12.566-26.916c5.552-5.553 12.514-9.13 20.349-10.918l22.003-5.802c3.103 0 5.346 2.437 5.346 5.208c0 4.594-.545 6.844-3.218 10.12c-.765.938-1.999 1.768-3.725 2.633c-1.781.892-4.095 1.816-6.83 2.76c-2.2.761-4.548 1.494-6.895 2.173q-1.45.42-2.909.811c-8.373 2.257-14.801 10.298-15.74 18.706l-7.627 39.076c-1.189 9.134-3.73 16.817-7.775 22.459m-54.203-41.021h25.544l-.038 2.39l-.242 15.108c0 6.323 4.585 10.203 10.774 10.203c4.448 0 8.618-4.69 13.59-14.435l14.445-27.998c6.448-11.189 15.102-17.303 28.62-19.958l20.483-5.262c3.271 0 5.773 4.047 5.773 6.934c0 3.298-1.438 6.792-3.646 9.52c-1.996 2.466-6.233 4.616-10.18 5.445l-8.597 1.833c-6.832 2.307-13.165 7.01-16.11 12.567l-10.88 26.077c-4.1 8.983-8.295 15.557-13.312 20.302c-5.878 5.56-12.802 8.45-21.064 8.45c-7.569 0-15.424-2.693-21.501-7.517c-6.754-5.362-10.9-12.948-11.451-21.951z"/><use href="#SVGckwuItjE"/><use href="#SVGckwuItjE"/><path fillOpacity=".25" d="M238.798 80.975a12.7 12.7 0 0 1-1.433 1.992c-1.322 1.503-4.897 3.174-8.139 3.801l-9.76 1.93c-8.669 2.662-16.713 8.159-20.637 15.071l-11.882 26.232c-1.616 3.257-3.26 6.195-4.956 8.822a73 73 0 0 0 .802-4.927l2.91-14.904l7.973-15.456c5.743-9.94 13.248-15.223 25.527-17.622l19.532-5.017z"/><path fillOpacity=".25" d="M143.606 120.673v13.223c0 9.08 3.662 18.352 16.544 18.352c7.84 0 15.824-4.825 18.427-22.99l5.064-34.892c1.314-10.233 11.501-24.523 22.671-27.24c.428-.102 15.944-4.677 17.678-5.46c.689-.312 2.324-1.29 2.424-1.4c.6-.663 1.052-1.24 1.394-1.815c-2.54.654-20.559 5.47-20.559 5.47c-6.953 1.618-13 4.789-17.789 9.685c-5.623 5.75-9.41 13.763-10.993 24.265l-4.434 33.288c-1.217 10.143-5.659 16.854-12.952 16.854c-8.06 0-12.409-4.146-12.43-13.108l-.795-14.201z"/><path fill="#053949" d="M124.783 132.013v-16.47h27.294v2.353c0 21.18 5.804 30.352 18.823 30.352c11.489 0 19.39-8.207 24.42-21.672c5.74-15.362 14.442-22.328 31.41-22.328h23.23c2.935 0 5.252 2.421 5.252 5.345a13.73 13.73 0 0 1-4.04 9.739a13.77 13.77 0 0 1-9.766 4.036l-14.733-.06c-3.062 0-6.021 2.24-9.061 6.82c-2.534 3.817-4.668 8.34-8.06 16.559c-3.04 7.368-7.209 13.615-12.784 18.321c-6.82 5.76-15.406 8.888-25.868 8.888c-11.263 0-22.72-4.106-31.372-11.293c-9.342-7.76-14.745-18.467-14.745-30.59"/><path fill="#00D8FE" d="M129.488 120.248v11.765c0 10.671 4.746 20.075 13.047 26.97c7.804 6.483 18.196 10.207 28.365 10.207c9.352 0 16.862-2.737 22.832-7.777c4.94-4.17 8.697-9.8 11.47-16.522c3.508-8.498 5.73-13.21 8.49-17.365c3.821-5.759 8.003-8.925 12.991-8.925l14.733.061a9.06 9.06 0 0 0 6.431-2.66a9.02 9.02 0 0 0 2.66-6.41c0-.368-.259-.638-.548-.638h-23.23c-14.863 0-21.909 5.64-27 19.269c-2.433 6.513-5.629 12.125-9.747 16.402c-5.165 5.364-11.524 8.33-19.082 8.33c-15.635 0-23.02-10.83-23.504-32.707z"/><path fillOpacity=".25" d="M250.36 109.159c-.428.545-1.034 1.035-1.793 1.723c-1.621 1.47-3.802 2.308-6.137 2.308h-19.294c-10.756 0-16.348 8.402-23.372 23.87c-2.648 5.828-9.868 19.894-30.276 19.894c-20.407 0-26.352-19.922-26.352-29.176v-7.53h4.26c.485 21.877 7.869 32.706 23.504 32.706c7.558 0 13.917-2.965 19.083-8.33c4.117-4.276 7.313-9.888 9.746-16.401c5.091-13.629 12.137-19.269 27-19.269h23.23c.154 0 .3.077.402.205"/><path fill="#00D8FE" d="M145.663 125.415s-12.743 3.42-19.116 3.42c-6.371 0-18.881-3.42-18.881-3.42a1.965 1.965 0 0 1-1.965-1.965V78.984a1.965 1.965 0 0 1 1.965-1.965h37.997c1.085 0 1.965.88 1.965 1.965v44.466a1.964 1.964 0 0 1-1.965 1.965"/><path fill="#043849" d="M139.68 132.646c-1.524.327-2.977.615-4.35.86c-3.599.645-6.501.976-8.783.976c-2.26 0-5.109-.325-8.622-.957q-2.082-.375-4.412-.883A166 166 0 0 1 106.69 131a7.61 7.61 0 0 1-6.635-7.55V78.985a7.61 7.61 0 0 1 7.612-7.612h37.997a7.61 7.61 0 0 1 7.612 7.612v44.463a7.61 7.61 0 0 1-6.656 7.555q-3.451.893-6.939 1.644m6.168-7.24a1.965 1.965 0 0 0 1.78-1.958V78.984c0-1.085-.88-1.965-1.965-1.965h-37.997c-1.085 0-1.965.88-1.965 1.965v44.466c0 1.015.776 1.862 1.776 1.956l.247.023l.239.065c.048.014.103.028.25.067q3.236.85 6.503 1.564c1.486.323 2.893.605 4.21.842c3.21.578 5.753.868 7.621.868c1.89 0 4.49-.296 7.788-.887a124 124 0 0 0 4.158-.823a167 167 0 0 0 6.903-1.64l.223-.058z"/><g transform="translate(104.841 76.307)"><mask id="SVGCG2GwcEN" fill="#fff"><use href="#SVGblPwNdAk"/></mask><path fillOpacity=".25" d="M.647 14.765H11L5.353 54.294H.647z" mask="url(#SVGCG2GwcEN)"/></g><ellipse cx="105.232" cy="98.755" fill="#FFF" rx="11.785" ry="11.763"/><path fill="#063A49" d="M105.232 113.342c-8.067 0-14.608-6.53-14.608-14.587s6.541-14.586 14.608-14.586s14.608 6.53 14.608 14.586s-6.541 14.587-14.608 14.587m0-5.647c4.95 0 8.961-4.004 8.961-8.94s-4.01-8.939-8.961-8.939c-4.95 0-8.961 4.003-8.961 8.94c0 4.935 4.01 8.939 8.961 8.939"/><circle cx="105.232" cy="98.765" r="3.688" fill="#053949"/><ellipse cx="147.585" cy="98.755" fill="#FFF" rx="11.785" ry="11.763"/><path fill="#063A49" d="M147.585 113.342c-8.067 0-14.609-6.53-14.609-14.587s6.542-14.586 14.609-14.586s14.608 6.53 14.608 14.586s-6.541 14.587-14.608 14.587m0-5.647c4.95 0 8.961-4.004 8.961-8.94s-4.01-8.939-8.961-8.939c-4.95 0-8.961 4.003-8.961 8.94c0 4.935 4.01 8.939 8.96 8.939"/><circle cx="147.585" cy="98.765" r="3.688" fill="#053949"/><path fill="#043849" d="M138.05 95.505q-1.92.311-3.853.572c-3.162.423-5.707.641-7.685.641c-1.954 0-4.463-.218-7.574-.643q-1.786-.243-3.789-.572a192 192 0 0 1-5.943-1.072c-13.818-.249-23.918-9.297-23.918-22.218v-30.87C85.288 18.508 103.798 0 126.631 0c22.885 0 41.409 18.494 41.409 41.342v30.871c0 12.924-10.106 21.974-23.93 22.219q-3.023.584-6.06 1.073m5.742-6.716c11.012-.106 18.601-6.84 18.6-16.576v-30.87c0-19.728-15.993-35.696-35.761-35.696c-19.714 0-35.695 15.981-35.695 35.695v30.871c0 9.734 7.587 16.469 18.596 16.575l.266.003l.26.052l.223.044q2.884.568 5.782 1.043q1.93.316 3.638.55c2.88.393 5.156.591 6.811.591c1.684 0 4-.198 6.933-.591a142 142 0 0 0 3.706-.55q3.073-.495 6.129-1.09l.253-.049z"/><g transform="translate(90.253 4.778)"><mask id="SVG8f0pPUfj" fill="#fff"><use href="#SVGNzBL808u"/></mask><path fill="#00D8FE" d="M53.282 84.012s-11.348 2.281-17.023 2.281c-5.573 0-16.719-2.281-16.719-2.281C9.125 84.012.682 77.85.682 67.435v-30.87C.682 16.85 16.664.868 36.377.868C56.16.87 72.14 16.85 72.14 36.564v30.871c0 10.415-8.443 16.577-18.858 16.577" mask="url(#SVG8f0pPUfj)"/></g><g transform="translate(90.253 4.778)"><path fillOpacity=".25" d="M10.517 66.494V26.211c0-18.056 13.41-32.972 30.811-35.354a36 36 0 0 0-4.883-.341h-.068C16.664-9.484.682 6.496.682 26.21v40.283c0 10.415 8.443 18.858 18.858 18.858h9.834c-10.414 0-18.857-8.443-18.857-18.858" mask="url(#SVG8f0pPUfj)"/></g><g transform="translate(90.253 4.778)"><circle cx="32.57" cy="65.982" r="3.688" fillOpacity=".25" mask="url(#SVG8f0pPUfj)"/></g><g transform="translate(90.253 4.778)"><circle cx="22.688" cy="46.688" r="3.688" fillOpacity=".25" mask="url(#SVG8f0pPUfj)"/></g><g transform="translate(90.253 4.778)"><circle cx="36.411" cy="28.685" r="3.688" fillOpacity=".25" mask="url(#SVG8f0pPUfj)"/></g><g transform="translate(90.253 4.778)"><circle cx="49.982" cy="47.629" r="3.688" fillOpacity=".25" mask="url(#SVG8f0pPUfj)"/></g>
  </svg>
);

SVG Logos

More like it

Icons that share its tags, in the same style.

All 2,063 icons
  • React Query icon from SVG Logos
  • React Router icon from SVG Logos
  • React Spring icon from SVG Logos
  • Rax icon from SVG Logos
  • Reactivex icon from SVG Logos
  • React Query Icon icon from SVG Logos
  • Atomicojs icon from SVG Logos
  • Atomicojs Icon icon from SVG Logos
  • Aurelia icon from SVG Logos
  • Glimmerjs icon from SVG Logos
  • Headlessui Icon icon from SVG Logos
  • Jotai icon from SVG Logos
  • Mantine Icon icon from SVG Logos
  • React icon from SVG Logos
  • Atom icon from SVG Logos
  • Atomic icon from SVG Logos
  • Atomic Icon icon from SVG Logos
  • Atom Icon icon from SVG Logos
  • Aurora icon from SVG Logos
  • Aurous icon from SVG Logos
  • Auth 0 icon from SVG Logos
  • Docusaurus icon from SVG Logos
  • Grommet icon from SVG Logos
  • Headlessui icon from SVG Logos

Search SVG Logos

Skip the copy and paste. With Pro, your AI agent finds and installs any SVG Logos icon from a prompt.

Get Pro

Tags

Browse by tag

React Styleguidist is tagged programming, code, react and 2 more. Related tags follow; each opens its icons from every library.

All tags

Pricing

SVG Logos MCP, with Pro

Ask for React Styleguidist or any of 2,063 SVG Logos icons and your agent installs it. The MCP comes with every Pro plan, with 6,000+ blocks and 14 premium templates. The icons stay free.

See full pricing

4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.

Billed once a year in USD. Cancel anytime.

Individual

For personal projects & open source

$32instead of $49/mo

$389 billed yearly

  • How many people can use the license.Seats: 1 seat
  • Client work, SaaS products and anything you charge for.Commercial use: Personal & open source only
  • Production-ready React sections: hero, pricing, features, dashboards and more.Pro blocks: 6,000+ blocks
  • Complete multi-page sites you can ship as they are.Templates: All 14 templates
  • React icons from every major library, installable with one command.React icons: 294k+ icons
  • Presets that restyle every block, in light and dark.Themes: All 59 themes
  • Lets your AI editor search, preview and install blocks for you.MCP server: Basic usage
  • Priority requests are answered first.Support: Standard

Team

Most popular

For freelancers, agencies & startups

$66instead of $99/mo

$789 billed yearly · ≈ $13/dev/mo

Everything in Individual, plus

  • How many people can use the license.Seats: Up to 5 seats
  • Client work, SaaS products and anything you charge for.Commercial use: Included
  • Lets your AI editor search, preview and install blocks for you.MCP server: High usage
  • Priority requests are answered first.Support: Priority

Organization

For companies with larger teams

$132instead of $199/mo

$1,589 billed yearly

Everything in Team, plus

  • How many people can use the license.Seats: Unlimited seats
  • Lets your AI editor search, preview and install blocks for you.MCP server: Unlimited usage
  • Secure checkout via Stripe
  • Code lives in your repo
  • Keep what you've shipped if you cancel
  • License terms

FAQ

Frequently asked questions

What the React Styleguidist icon means and where it's used, then how to install, style and license it.

Install React Styleguidist from a prompt

MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.

Get Pro