Provider icon

Stackにはprovider-neutralなcore icon catalogが含まれます。AWS、Google Cloud、Azure、主要な開発・collaboration toolのartworkは、user-managed icon storeに保存するprovider packとして利用できます。

利用可能なprovider catalog

監査済みcatalogには合計1,051 IDがあります。AWS Architecture Icons 305件、Google Cloudのproduct・category icon 45件、Azure service icon 639件、主要tool icon 62件です。Tool catalogにはGitHub、GitHub Actions、Notion、Linear、Atlassian、Jira、Confluence、Docker、Kubernetes、Terraform、Datadog、Grafana、Sentryなどが含まれます。

Provider cardを選ぶとimport commandを確認できます。全catalogを検索・filterでき、小さいdeviceでも見やすいよう100件ずつ表示します。

ID、product、categoryを検索ProviderすべてのproviderAmazon Web Services (305) Google Cloud (45) Microsoft Azure (639) Simple Icons (curated tools) (62) Categoryすべてのcategoryai + machine learninganalyticsAnalyticsapp servicesApplication IntegrationArtificial Intelligenceazure ecosystemblockchainBlockchainBusiness ApplicationsCloud Financial ManagementCollaborationcomputeComputecontainersContainersCore productsCustomer EnablementDatadatabasesDatabasesdeveloper toolsDeveloper ToolsDevelopmentdevopsEnd User ComputingFront End Web MobileGamesgeneralGeneral Iconshybrid + multicloudidentityIdentityInfrastructureintegrationInternet of Thingsintuneiotmanagement + governanceManagement ToolsMedia ServicesmenumigrateMigration Modernizationmixed realitymonitornetworkingNetworking Content Deliverynew iconsObservabilityotherProduct categoriesQuantum TechnologiesSatellitesecuritySecurity IdentitystorageStorageweb

1,051 件

IDProductCategoryKindコピー

aws:amazon-api-gatewayAmazon API GatewayNetworking Content Deliveryservice

aws:amazon-appflowAmazon AppFlowApplication Integrationservice

aws:amazon-application-recovery-controllerAmazon Application Recovery ControllerNetworking Content Deliveryservice

aws:amazon-athenaAmazon AthenaAnalyticsservice

aws:amazon-augmented-ai-a2iAmazon Augmented AI A2IArtificial Intelligenceservice

aws:amazon-auroraAmazon AuroraDatabasesdatabase

aws:amazon-bedrockAmazon BedrockArtificial Intelligenceservice

aws:amazon-bedrock-agentcoreAmazon Bedrock AgentCoreArtificial Intelligenceservice

aws:amazon-braketAmazon BraketQuantum Technologiesservice

aws:amazon-chimeAmazon ChimeBusiness Applicationsservice

aws:amazon-chime-sdkAmazon Chime SDKBusiness Applicationsservice

aws:amazon-cloud-directoryAmazon Cloud DirectorySecurity Identityservice

aws:amazon-cloudfrontAmazon CloudFrontNetworking Content Deliveryservice

aws:amazon-cloudsearchAmazon CloudSearchAnalyticsservice

aws:amazon-cloudwatchAmazon CloudWatchManagement Toolsservice

aws:amazon-codecatalystAmazon CodeCatalystDeveloper Toolsservice

aws:amazon-codeguruAmazon CodeGuruArtificial Intelligenceservice

aws:amazon-codewhispererAmazon CodeWhispererArtificial Intelligenceservice

aws:amazon-cognitoAmazon CognitoSecurity Identityservice

aws:amazon-comprehendAmazon ComprehendArtificial Intelligenceservice

aws:amazon-comprehend-medicalAmazon Comprehend MedicalArtificial Intelligenceservice

aws:amazon-connectAmazon ConnectBusiness Applicationsservice

aws:amazon-correttoAmazon CorrettoDeveloper Toolsservice

aws:amazon-data-firehoseAmazon Data FirehoseAnalyticsservice

aws:amazon-datazoneAmazon DataZoneAnalyticsservice

aws:amazon-dcvAmazon DCVComputeservice

aws:amazon-detectiveAmazon DetectiveSecurity Identityservice

aws:amazon-devops-guruAmazon DevOps GuruArtificial Intelligenceservice

aws:amazon-documentdbAmazon DocumentDBDatabasesdatabase

aws:amazon-ec2-auto-scalingAmazon EC2 Auto ScalingComputeservice

aws:amazon-ec2-image-builderAmazon EC2 Image BuilderComputeservice

aws:amazon-ecs-anywhereAmazon ECS AnywhereContainersservice

aws:amazon-efsAmazon EFSStoragestorage

aws:amazon-eks-anywhereAmazon EKS AnywhereContainersservice

aws:amazon-eks-distroAmazon EKS DistroContainersservice

aws:amazon-elastic-block-storeAmazon Elastic Block StoreStoragestorage

aws:amazon-elastic-container-registryAmazon Elastic Container RegistryContainersservice

aws:amazon-elastic-container-serviceAmazon Elastic Container ServiceContainersservice

aws:amazon-elastic-inferenceAmazon Elastic InferenceArtificial Intelligenceservice

aws:amazon-elastic-vmware-serviceAmazon Elastic VMware ServiceComputeservice

aws:amazon-elasticacheAmazon ElastiCacheDatabasescache

aws:amazon-emrAmazon EMRAnalyticsservice

aws:amazon-eventbridgeAmazon EventBridgeApplication Integrationqueue

aws:amazon-file-cacheAmazon File CacheStoragestorage

aws:amazon-finspaceAmazon FinSpaceAnalyticsservice

aws:amazon-forecastAmazon ForecastArtificial Intelligenceservice

aws:amazon-fraud-detectorAmazon Fraud DetectorArtificial Intelligenceservice

aws:amazon-fsxAmazon FSxStoragestorage

aws:amazon-fsx-for-lustreAmazon FSx for LustreStoragestorage

aws:amazon-fsx-for-netapp-ontapAmazon FSx for NetApp ONTAPStoragestorage

aws:amazon-fsx-for-openzfsAmazon FSx for OpenZFSStoragestorage

aws:amazon-fsx-for-wfsAmazon FSx for WFSStoragestorage

aws:amazon-gamelift-serversAmazon GameLift ServersGamesservice

aws:amazon-gamelift-streamsAmazon GameLift StreamsGamesservice

aws:amazon-guarddutyAmazon GuardDutySecurity Identityservice

aws:amazon-inspectorAmazon InspectorSecurity Identityservice

aws:amazon-interactive-video-serviceAmazon Interactive Video ServiceMedia Servicesservice

aws:amazon-kendraAmazon KendraArtificial Intelligenceservice

aws:amazon-keyspacesAmazon KeyspacesDatabasesdatabase

aws:amazon-kinesisAmazon KinesisAnalyticsservice

aws:amazon-kinesis-data-streamsAmazon Kinesis Data StreamsAnalyticsservice

aws:amazon-kinesis-video-streamsAmazon Kinesis Video StreamsAnalyticsservice

aws:amazon-kinesis-video-streams-media-servicesAmazon Kinesis Video StreamsMedia Servicesservice

aws:amazon-lexAmazon LexArtificial Intelligenceservice

aws:amazon-lightsailAmazon LightsailComputeservice

aws:amazon-lightsail-for-researchAmazon Lightsail for ResearchComputeservice

aws:amazon-location-serviceAmazon Location ServiceFront End Web Mobileservice

aws:amazon-lookout-for-equipmentAmazon Lookout for EquipmentArtificial Intelligenceservice

aws:amazon-lookout-for-visionAmazon Lookout for VisionArtificial Intelligenceservice

aws:amazon-macieAmazon MacieSecurity Identityservice

aws:amazon-managed-blockchainAmazon Managed BlockchainBlockchainservice

aws:amazon-managed-grafanaAmazon Managed GrafanaManagement Toolsservice

aws:amazon-managed-service-for-apache-flinkAmazon Managed Service for Apache FlinkAnalyticsservice

aws:amazon-managed-service-for-prometheusAmazon Managed Service for PrometheusManagement Toolsservice

aws:amazon-managed-streaming-for-apache-kafkaAmazon Managed Streaming for Apache KafkaAnalyticsservice

aws:amazon-managed-workflows-for-apache-airflowAmazon Managed Workflows for Apache AirflowApplication Integrationservice

aws:amazon-memorydbAmazon MemoryDBDatabasescache

aws:amazon-monitronAmazon MonitronArtificial Intelligenceservice

aws:amazon-mqAmazon MQApplication Integrationservice

aws:amazon-neptuneAmazon NeptuneDatabasesdatabase

aws:amazon-novaAmazon NovaArtificial Intelligenceservice

aws:amazon-opensearch-serviceAmazon OpenSearch ServiceAnalyticsservice

aws:amazon-personalizeAmazon PersonalizeArtificial Intelligenceservice

aws:amazon-pinpointAmazon PinpointBusiness Applicationsservice

aws:amazon-pinpoint-apisAmazon Pinpoint APIsBusiness Applicationsservice

aws:amazon-pollyAmazon PollyArtificial Intelligenceservice

aws:amazon-qAmazon QArtificial Intelligenceservice

aws:amazon-quickAmazon QuickBusiness Applicationsservice

aws:amazon-redshiftAmazon RedshiftAnalyticsservice

aws:amazon-rekognitionAmazon RekognitionArtificial Intelligenceservice

aws:amazon-route-53Amazon Route 53Networking Content Deliveryservice

aws:amazon-s3-on-outpostsAmazon S3 on OutpostsStoragestorage

aws:amazon-sagemakerAmazon SageMakerAnalyticsservice

aws:amazon-sagemaker-aiAmazon SageMaker AIArtificial Intelligenceservice

aws:amazon-sagemaker-ground-truthAmazon SageMaker Ground TruthArtificial Intelligenceservice

aws:amazon-sagemaker-studio-labAmazon SageMaker Studio LabArtificial Intelligenceservice

aws:amazon-security-lakeAmazon Security LakeSecurity Identityservice

aws:amazon-simple-email-serviceAmazon Simple Email ServiceBusiness Applicationsservice

aws:amazon-simple-notification-serviceAmazon Simple Notification ServiceApplication Integrationservice

aws:amazon-simple-storage-service-glacierAmazon Simple Storage Service GlacierStoragestorage

Provider packが追加するのはartworkです。Semantic stylingとlayoutはStack sourceに書いたnode kindが引き続き決めます。

Quick start

Diagramで使うproviderを一度ずつimportします。--accept-termsは、link先のprovider・brand termsを確認して同意したことを記録します。

$ stack icons import gcp --accept-terms
$ stack icons import simple-icons --accept-terms
$ stack render architecture.stack -o architecture.svg

CLIは監査済みの公式archiveをdownloadし、archive全体のSHA-256を検証し、選択したSVGをsanitizeして、処理済みprovider packをshared icon storeへ保存します。Google Cloudのproduct・category artworkは1つのgcp commandで一緒にimportされます。

CLIでprovider iconを使う

1つのStack fileで複数providerを利用できます。次の例はGoogle CloudのCloud RunとSimple IconsのGitHubを組み合わせます。

stack 1.0

diagram "Deploy from GitHub to Cloud Run" {
  node repository "GitHub" {
    kind external
    icon "simple-icons:github"
  }

  node service "Cloud Run" {
    kind service
    icon "gcp:cloud-run"
  }

  edge repository -> service "Deploy" {
    kind dependency
  }
}

2つをimportした後は、通常のrender commandが両方のpackを見つけます。

$ stack render architecture.stack -o architecture.svg --notice architecture.NOTICE.md

Shared icon store

Default icon storeは$XDG_CONFIG_HOME/stack/iconsです。XDG_CONFIG_HOMEが未設定の場合は$HOME/.config/stack/iconsを使います。

icons/
  aws/
  gcp/
  azure/
  simple-icons/

$XDG_CONFIG_HOME/stack/config.yamlにabsolute pathを書くと、shared locationを変更できます。

default_icons_path: /absolute/path/to/stack-icons

このlocationはstack icons importとstack renderの両方で使われます。

Playgroundでprovider iconを使う

Iconsを開いてstack/icons folderを選ぶと、Playgroundがstore内の認識可能なprovider directoryをすべてloadします。Loadしたartworkを検索し、選択するとIDをStack sourceへcopyできます。

選択したpackは現在のbrowser tabで処理されます。生成diagramにprovider artworkが含まれる場合は、SVG download横のNoticeからsource、terms、使用iconの記録を取得できます。

Iconをprojectと一緒に管理する

Import済みpackをrepositoryへ含める場合は、-oでproject directoryを指定します。

$ stack icons import gcp --accept-terms -o .stack-icons
$ stack icons import simple-icons --accept-terms -o .stack-icons

Render時は--provider-packへ同じicon-store rootを渡します。

$ stack render architecture.stack \
  --provider-pack .stack-icons \
  -o architecture.svg \
  --notice architecture.NOTICE.md

Icon IDを探す

CLIまたはこのpageでcatalogを検索できます。

$ stack icons list
$ stack icons list aws s3
$ stack icons list azure database
$ stack icons list simple-icons github

CLI outputにはID、PRODUCT、CATEGORY、推奨KINDが含まれます。gcp:cloud-runやsimple-icons:githubのようなnamespaced IDが対応するpackのartworkを選択します。

検証・terms・notice

CLI catalogは公式HTTPS archive URL、release、archive全体のSHA-256、allowlist済みentry path、terms URL、review dateをpinしています。Importではarchive・SVGのsizeを制限し、active・external SVG contentをsanitizeして、packをatomicに保存します。

各packにはNOTICE.mdが含まれます。stack render --notice <PATH>は、実際のpack revision、source release、terms URL、attribution、non-endorsement text、使用icon IDを出力します。Catalogから各providerの公式sourceとterms、Simple Iconsのbrand sourceとguidelineを確認できます。